<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title></title>

</head>

<body>

<div class="container">

    <ul class="clearfix">

        <li>

            <img src="data:images/xy_52.jpg" alt=""/>

        </li>

        <li>

            <h5>我是标题</h5>

            <p>我是好人我是好人我是好人我是好人我是好人我是好人</p>

        </li>

    </ul>

</div>

</body>

</html>

html

        *{margin:;padding:;}

        .clearfix{zoom:;}

        .clearfix:after{content:".";display:block;width:;height:;visibility:hidden;clear:both;}

        .container{width:600px;margin:20px auto;}

        ul{list-style:none;width:200px;background:red}

        ul li{float:left;width:100px;height:100px;transition:all 1s linear 0;background:green;}

        ul li:hover{transform:scale(1.2);background:yellow;}

        ul li:hover p,ul li:hover h5{color:#fff;}

        li img{border:;width:100%;}

        h5{height:30px;line-height:30px;}

        h5,p{font-size:12px;padding:0 6px;}

        p{height:70px;}

css

鼠标经过容器放大--css3的更多相关文章

  1. 基于CSS3鼠标滑过放大突出效果

    还记得之前分享过一款CSS3图片悬停放大特效,效果非常不错.今天我们要再来分享一款类似的CSS鼠标滑过放大突出效果,只不过之前那个是图片,这次是色块,其实掌握了其CSS原理,任何网页元素都可以实现这种 ...

  2. 浅谈CSS和JQuery实现鼠标悬浮图片放大效果

    对于刚刚学习网页前台设计的同学一定对图片的处理非常苦恼,那么这里简单的讲解一下几个图片处理的实例. 以.net为平台,微软的Visual Studio 2013为开发工具,当然前台技术还是采用CSS3 ...

  3. JS判断鼠标进入容器方向的方法和分析window.open新窗口被拦截的问题

    1.鼠标进入容器方向的判定 判断鼠标从哪个方向进入元素容器是一个经常碰到的问题,如何来判断呢?首先想到的是:获取鼠标的位置,然后经过一大堆的if..else逻辑来确定.这样的做法比较繁琐,下面介绍两种 ...

  4. jQuery鼠标悬停图片放大显示

    jQuery鼠标悬浮放于图片上之后图片放大显示的效果,即鼠标移到图片上图片突出显示,鼠标移开后恢复原来的模样,你可以在图片滚动效果中加上本特效,相信会更炫一些. <!DOCTYPE html P ...

  5. 鼠标滚轮图片放大缩小功能，使用layer弹框后不起作用

    今天在项目中遇到的一个问题:点击按钮使用layer弹框弹出一张图片,需要加一个鼠标滚轮放大缩小,图片也跟着放大缩小的功能.于是在网上找了一个demo. DEMO: <!DOCTYPE html ...

  6. 2015.10.11（js判断鼠标进入容器的方向）

    判断鼠标进入容器的方向 1.前几天在万圣节专题项目中用到了鼠标坐标page事件,随着鼠标背景图片移动形成有层次感的效果,但page事件在IE低版本不支持,所以还要做兼容.在研究page事件同时无意中想 ...

  7. 常用css样式（文字超出部分用省略号显示、鼠标经过图片放大、出现阴影）

    文字超出部分用省略号显示: white-space: nowrap; /* 不换行 */ overflow: hidden; /* 超出部分不显示 */ text-overflow: ellipsis ...

  8. [Unity3D]Unity3D游戏开发之鼠标滚轮实现放大缩小

    今天为大家分享的是在Rpg游戏中十分常见的鼠标滚轮调整摄像机视野效果.首先我们先创建一个游戏场景: 接下来我们编写一段脚本代码: [csharp] view plaincopyprint" ...

  9. jquery图片放大插件鼠标悬停图片放大效果

    都知道jquery都插件是非常强大的,最近分享点jquery插件效果,方便效果开发使用. 一.HTML代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHT ...

随机推荐

  1. 获取或者设置时，无后缀和A后缀和W后缀的区别

    SetWindowTextW表示设置的字符串是WCHAR (双字节字符 )SetWindowTextA表示设置的字符串是CHAR (单字节字符 )SetWindowText表示设置的字符串是自动匹配当 ...

  2. Statement和PreparedStatement批量更新

    优势:1.节省传递时间. 2.并发处理. PreparedStatement: 1) addBatch()将一组参数添加到PreparedStatement对象内部. 2) executeBatch( ...

  3. BASE64,MD5,SHA,HMAC加密與解密算法(java)

    package com.ice.webos.util.security; import java.io.UnsupportedEncodingException; import java.math.B ...

  4. MySQL(二) —— 数据类型与操作数据表

    数据类型 数据类型是指列.存储过程参数.表达式和局部变量的数据特征,它决定了数据的存储格式,代表了不同的信息类型. 整型:TYNINT(-2^7 ~ 2^7-1); SMALLINT(-2^15 ~ ...

  5. Linux的查找命令

    1. 文件搜索find find是最常见和最强大的查找命令,你可以用它找到任何你想找的文件. find的使用格式如下: $ find [搜索路径] [搜索条件]［搜索文件名］ 如果什么参数也不加,fi ...

  6. CSS笔记（十二）CSS3之2D和3D转换

    参考:http://www.w3school.com.cn/css3/css3_2dtransform.asp 2D Transform 方法 函数 描述 matrix(n,n,n,n,n,n) 定义 ...

  7. C#线程系列讲座(5)：同步技术之Monitor

    在上一讲介绍了使用lock来实现线程之间的同步.实际上,这个lock是C#的一个障眼法,在C#编译器编译lock语句时,将其编译成了调用Monitor类.先看看下面的C#源代码: public sta ...

  8. 利用EL表达式+JSTL在客户端取得数据 示例

    <%@page import="cn.gbx.domain.Address"%> <%@page import="cn.gbx.domain.User& ...

  9. MVC服务器前台提示

    [HttpPost] public ActionResult AddMsg(MsgModel model) { string strSql = "insert into tbl_msg(ti ...

  10. iOS - Swift NSValue 值

    前言 public class NSValue : NSObject, NSCopying, NSSecureCoding 将任意数据类型包装成对象. 1.比较两个 NSValue 类型数据的大小 l ...