css
css一些扩展
风翻火焰
tel:13552106430
eMail:chern1992@163.com
展开
-
彻底搞懂CSS层叠上下文、层叠等级、层叠顺序、z-index
前言最近,在项目中遇到一个关于CSS中元素z-index属性的问题,具体问题不太好描述,总结起来就是当给元素和父元素色设置position属性和z-index相关属性后,页面上渲染的元素层级结果和我预想的不一样。根据自己之前的理解,也没找到一个合理的解释。我知道,肯定是我对相关属性的细节理解存在问题,所以结合官方文档和在网上各种搜集整理,明白了其中的原因。写下这篇文章,和大家分享有关CSS中层叠上下文、层叠等级、层叠顺序以及z-index相关的一整套技术细节。如果存在什么错误或重要遗漏或者有什么疑问转载 2020-07-01 22:12:11 · 675 阅读 · 0 评论 -
浏览器的回流与重绘 (Reflow & Repaint)
写在前面在讨论回流与重绘之前,我们要知道:浏览器使用流式布局模型 (Flow Based Layout)。 浏览器会把HTML解析成DOM,把CSS解析成CSSOM,DOM和CSSOM合并就产生了Render Tree。 有了RenderTree,我们就知道了所有节点的样式,然后计算他们在页面上的大小和位置,最后把节点绘制到页面上。 由于浏览器使用流式布局,对Render Tree的计算通常只需要遍历一次就可以完成,但table及其内部元素除外,他们可能需要多次计算,通常要花3倍于同等元素的时转载 2020-07-01 22:09:53 · 247 阅读 · 0 评论 -
overflow:hidden属性导致样式错位
问题如题。原因:当改变overflow属性的时候会生成一个新的box,而默认的vertical-align是baseline,所以会导致错位。解决方法:只要加任意vertical-align属性,无论top, bottom, 还是middle都能解决。原创 2020-06-29 17:41:05 · 1532 阅读 · 0 评论 -
使<pre>的内容自动换行
prepre 空原创 2017-11-08 14:43:32 · 687 阅读 · 0 评论 -
微信端input输入框在ios手机上连续输入卡顿
input无法输入原创 2017-11-14 15:07:00 · 4653 阅读 · 0 评论 -
sass移动端常用mixin+function
mixin原创 2017-09-06 17:58:29 · 1665 阅读 · 0 评论