CSS
青山拂晓
这个作者很懒,什么都没留下…
展开
-
flex弹性布局学习
一.起源:2009年W3C提出了一种新的方案—-Flex布局,可以简便、完整、响应式地实现各种页面布局。支持IE10+。二.概念:Flex是Flexible Box的缩写,意为”弹性布局”,用来为盒状模型提供最大的灵活性。任何一个容器都可以被指定为flex布局。.box{ display: flex;}.box{ display: inline-flex;}Webkit内核的浏览器,必...原创 2018-03-15 17:40:03 · 383 阅读 · 0 评论 -
transition和animation整理
1.transion: 只对块级元素生效 2.transition:transition-property, transition-duration, transition-timing-function, 和transition-delay 3.在transition属性中,各个值的书写顺序是很重要的:第一个可以解析为时间的值会被赋值给transition-duration,第二...原创 2018-11-20 10:04:15 · 176 阅读 · 0 评论 -
css position 属性详解
position属性有 sticky,relative,absulute、fixed四种。1.position:static是否脱离文档流:否 特征:top bottom left right z-index会无效2.position:relative 是否脱离文档流:否 特征:相对于原来的位置定位,其他的元素位置不会受到影响3.position:abso...原创 2019-03-30 11:19:20 · 317 阅读 · 0 评论 -
css 水平居中整理
1.利用table属性 父元素设为display:table;子元素设为display:table-cell;vertical-align:middle;text-align:center;具体代码为.parent { width:300px; height:300px; background:#000; display:table;}.child ...原创 2019-04-02 00:18:01 · 95 阅读 · 0 评论 -
sass小结
1.属性可以嵌套 例 p { border: { color: red; } } 注意:border后面一定要加上:2.继承 .class1 { border:1px solid #ddd; } .class2 { @extend .class1 font-size:1...原创 2019-04-29 13:45:28 · 139 阅读 · 0 评论 -
js给伪元素添加点击事件的2种方式
在html元素种 我们有可能遇到这样的需求 :如何给伪元素添加点击事件? 经过思考及查找相应的资料后,整理初2种方式,记录一下:一、给元素设置pointer-events:none.然后给伪元素的pointer-events:auto;此时我们把点击元素的事件就取消了 点击伪元素的时候,就可以绑定相应的事件了二、第二种是:通过子元素的事件冒泡原理,在子元素事件处理结束后retur...原创 2019-05-24 15:37:02 · 9283 阅读 · 0 评论