CSS
文章平均质量分 77
清箫
生命的可贵,在于自我实现;生命的欠缺,是努力的空间。
展开
-
垂直居中的几种方法比较(纯CSS)
方法一 content .table {display:table;}.table-cell {display:table-cell; vertical-align:middle;}优点:content 可以动态改变高度,如果你不需要支持IE7浏览器,这个应该是首选方案,也是W3C推荐的方案。缺点:IE7和IE8 beta不支持。方法二Content#content { p原创 2015-04-19 22:44:32 · 2495 阅读 · 5 评论 -
元素绘制顺序
元素绘制顺序,顾名思义,即浏览器创建和布局元素的顺序,包括时间和空间顺序。层叠上下文HTML元素大多是二维的,所谓层叠上下文是指当多个元素在二维空间重叠时,如何在一个三维的空间上确定各元素的位置。形成层叠上下文的元素就会有一个三维坐标,这个第三维的坐标值受z-index的影响,但这个三维坐标的值并不一定等于z-index的值。需要注意,HTML元素大部分是流式布局的(从上到下),元素之间并没有重叠原创 2015-12-18 17:08:27 · 2175 阅读 · 0 评论 -
CSS3 Flex计算逻辑
Flex样式Flex: flex-grow | flex-shrink | flex-basisflex-grow:纯数字,表示增长因子。默认值为0,表示按元素的原大小显示。 flex-shrink:纯数字,表示收缩因子。默认值是1,如果是0则按原始大小显示。当屏幕或容器变小时,不同元素的收缩比例可能与容器变大的逻辑是不一样的,所以会有这个属性。 flex-basis:表示flex-i...原创 2016-06-10 21:08:18 · 4343 阅读 · 2 评论 -
元素转换-Transform
所谓元素转换,其实就是对元素的坐标在二维或三维空间上做矩阵换算。根据换算的结果,又分成了多种转换类型。但无论是哪一种,都不影响元素在页面上的物理空间,只改变元素的视觉效果。也就是说,比如元素缩放、旋转都不影响周围其他元素的布局。有些开发者喜欢用平移做元素居中效果,其实非常不妥,因为元素原来的物理空间还在那里,控制起来不轻松。另外,转换属性(transform)只有一个,因此,转换类型不能叠加。也就原创 2015-12-21 18:22:41 · 3686 阅读 · 0 评论