随笔分类 -  html css

滚动触发特效
摘要：<div class="index_shuzi_bg"> <div class="index_shuzi"> <li> <dt num='2012' id="index_sz1">0</dt> <dd>公司成立于2012年</dd> </li> <li> <dt num='21' id="index 阅读全文
posted @ 2021-08-28 23:20 MasterC 阅读(52) 评论(0) 推荐(0)
手机站常用 代码
摘要：顶部导航 <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" /> <link rel="stylesheet" type="text/css" 阅读全文
posted @ 2020-11-22 17:18 MasterC 阅读(168) 评论(0) 推荐(0)
css忽略某一层的存在：pointer-events:none
摘要：pointer-events:none pointer-events:autoGoogle map中左上角的操作区域占位是挺大的，如红色框区域，然后在这个区域是无法操作地图层的。那么我们就可以给这个div设置 pointer-events:none，然后你就会发现下面的地图就可以拖动和点击了。但是悲 阅读全文
posted @ 2018-06-20 11:26 MasterC 阅读(471) 评论(0) 推荐(0)
图片上下左右居中
摘要：图片外层元素添加下方属性 display: table-cell; vertical-align: middle; 阅读全文
posted @ 2017-02-24 10:07 MasterC 阅读(192) 评论(0) 推荐(0)
css text-overflow:ellipsis 文字多余剪切
摘要：text-overflow: ellipsis;多度剪切white-space: nowrap;禁止换行overflow: hidden;多余隐藏 阅读全文
posted @ 2016-06-29 11:09 MasterC 阅读(284) 评论(0) 推荐(0)
table 相关
摘要：border-collapse: collapse; 合并多余边框 阅读全文
posted @ 2016-04-11 11:32 MasterC 阅读(106) 评论(0) 推荐(0)
column css3 列宽 实现瀑布流
摘要：掌握点： 1、column-count 把div中的文本分为多少列 2、column-width 规定列宽 3、column-gap 规定列间隙 4、break-inside: avoid; ←在制作手机站瀑布流时候，会出现图片错乱，请使用这个属性：避免元素内部断行并产生新列； 注意: Intern 阅读全文
posted @ 2016-02-29 19:51 MasterC 阅读(1662) 评论(0) 推荐(0)
css 3d 动画 相关
摘要：transform-style: preserve-3d; 设置3D模式perspective：700px ；属性定义 3D 元素距视图的距离，以像素计。该属性允许您改变 3D 元素查看 3D 元素的视图。当为元素定义 perspective 属性时，其子元素会获得透视效果，而不是元素本身persp... 阅读全文
posted @ 2015-07-11 00:27 MasterC 阅读(195) 评论(0) 推荐(0)
各种属性区别
摘要：mouseover（），mouseout（）不论鼠标指针穿过被选元素或其子元素，都会触发mouseenter（）//进入 ，mouseleave（）//离开 只有在鼠标指针穿过被选元素时scrollLeft()对象的最左边到对象在当前窗口显示的范围内的左边的距离．即是在出现了横向滚动条的情况下，... 阅读全文
posted @ 2015-07-11 00:22 MasterC 阅读(170) 评论(0) 推荐(0)
倒影 渐变
摘要：img{-webkit-box-reflect:below 0 -webkit-linear-gradient(top,rgba(0,0,0,0.1),rgba(0,0,0,1)); }above：指定倒影在对象的上边below：指定倒影在对象的下边left：指定倒影在对象的左边right：指定倒... 阅读全文
posted @ 2015-07-08 00:59 MasterC 阅读(126) 评论(0) 推荐(0)