<!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. Page_Load 事件

    Page_Load 事件是众多 ASP.NET 可理解的事件之一.Page_Load 事件会在页面加载时被触发,然后 ASP.NET 会自动调用子例程 Page_Load<%@ Page Lan ...

  2. C#注册表操作，根据键取值

    string into = ""; RegistryKey key = Registry.LocalMachine; RegistryKey myreg = key.OpenSub ...

  3. Shared Preferences 数据存储

    SharedPreferences类,它是一个轻量级的存储类,特别适合用于保存软件配置参数. 其背后是用xml文件存放数据,文件存放在/data/data/<package name>/s ...

  4. 【Unity3D游戏开发】GameObject.Find()、Transform.Find查找隐藏对象 (十)

    GameObjectFindTransformFind查找游戏对象 前置条件 相关API 1 GameObjectFind 2 TransformFind 3 其他查找 实际测试 即使隐藏root节点 ...

  5. Cheatsheet: 2014 08.01 ~ 08.31

    Web Slow Server? This is the Flow Chart You're Looking For A Strolll Through Node: Introduction .NET ...

  6. Creating Excel File in Oracle Forms

    Below is the example to create an excel file in Oracle Forms.Pass the Sql query string to the below ...

  7. Metasploit RPC服务共享

    1) 启动一个新的MSF RPC服务,-P参数后面指定连接到的RPC服务需要提供的口令,-U参数指定连接所需输入的用户名,使用-a 0.0.0.0将RPC服务绑定到所有的网络地址,否则服务默认只绑定到 ...

  8. SQL生成包含年月日的流水号

    --************************************************************************************************** ...

  9. APP前端公共测试点

  10. "npm ERR! Error: EPERM: operation not permitted"问题解决

    在基于macaca进行自动化测试的时候,遇到如下问题: E:\AutoTest\Macaca\LocalTEST\macaca-test-sample\macaca-test>macaca do ...