![](https://img-blog.csdnimg.cn/20201014180756780.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
css
水势年华
努力过日子
展开
-
css-清除浮动
1.定义: 在非IE浏览器中,当容器的高度为auto,且容器的内容中有浮动(float为left或right)的元素,在这种情况下,容器的高度不能自动伸长以适应内容的高度,使得内容溢出到容器外面而影响(甚至破坏)布局的现象。为了防止这种现象出现的处理即为清除浮动。2.清除浮动方法:①使用带clear属性的空元素在浮动元素后使用一个空元素如<div class="c...原创 2018-11-05 15:03:06 · 92 阅读 · 0 评论 -
前端性能优化(css动画篇)
1、原理:css3动画绘制效率高的方法:☆改变位置☆改变大小☆旋转☆改变透明度2、CSS的图层的概念(Chrome浏览器)(1)浏览器所做的工作实际上是:获取DOM后分割为多个图层 对每个图层的节点计算样式结果(Recalculate style--样式重计算) 为每个节点生成图形和位置(Layout--回流和重布局) 将每个节点绘制填充到图层位图中(Pain...原创 2018-11-05 16:06:11 · 267 阅读 · 0 评论 -
css3新增属性
一. box-shadow(阴影效果)使用:box-shadow: 20px 10px 0 #000;-moz-box-shadow: 20px 10px 0 #000;-webkit-box-shadow: 20px 10px 0 #000;支持: FF3.5, Safari 4, Chrome 3二. border-colors(为边框设置多种颜色)...转载 2018-11-05 16:23:56 · 136 阅读 · 0 评论 -
flex语法
1、含义:任何一个容器都可以指定为flex布局,行内元素也可以:inline-flex注意:webkit内核的浏览器,必须加上-webkit前缀:display:-webkit-flex;flex布局后,子元素的float、clear和vertical-align属性将会失效2、容器的属性①flex-direction:决定排列方向值:row、row-reverse、colum...原创 2019-03-13 19:07:18 · 169 阅读 · 0 评论