![](https://img-blog.csdnimg.cn/20201014180756926.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
css面试题
你很棒棒哦
web前端未来攻城狮 一起努力 一起成长
展开
-
CSS面试题31-35
31.zoom:1 的清除浮动原理?清除浮动,触发hasLayout;zoom属性是IE浏览器的专有属性,它可以设置或检索对象的缩放比例。解决ie下比较奇葩的bug。譬如外边距(margin)的重叠,浮动清除,触发ie的haslayout属性等。来龙去脉大概如下:当设置了zoom的值之后,所设置的元素就会就会扩大或者缩小,高度宽度就会重新计算了,这里一旦改变zoom值时其实也会发生重新渲染,运用这个原理,也就解决了ie下子元素浮动时候父元素不随着自动扩大的问题。zoom属性是IE浏览器原创 2020-12-08 14:24:40 · 286 阅读 · 0 评论 -
CSS面试题26-30
26.margin 重叠问题的理解。相关知识点:块级元素的上外边距(margin-top)与下外边距(margin-bottom)有时会合并为单个外边距,这样的现象称为“margin合并”。产生折叠的必备条件:margin必须是邻接的!而根据w3c规范,两个margin是邻接的必须满足以下条件:•必须是处于常规文档流(非float和绝对定位)的块级盒子,并且处于同一个BFC当中。•没有线盒,没有空隙,没有padding和border将他们分隔开•都属于垂直方向上相邻的外边距,可以原创 2020-12-08 13:57:06 · 299 阅读 · 0 评论 -
CSS面试题21-25
21.CSS 里的 visibility 属性有个 collapse 属性值是干嘛用的?在不同浏览器下以后什么区别?(1)对于一般的元素,它的表现跟visibility:hidden;是一样的。元素是不可见的,但此时仍占用页面空间。(2)但例外的是,如果这个元素是table相关的元素,例如table行,table group,table列,table column group,它的表现却跟display:none一样,也就是说,它们占用的空间也会释放。在不同浏览器下的区别:在谷歌浏览器里原创 2020-12-08 11:23:51 · 256 阅读 · 0 评论 -
CSS面试题16-20
16.CSS 多列等高如何实现?(1)利用padding-bottom|margin-bottom正负值相抵,不会影响页面布局的特点。设置父容器设置超出隐藏(overflow:hidden),这样父容器的高度就还是它里面的列没有设定padding-bottom时的高度,当它里面的任一列高度增加了,则父容器的高度被撑到里面最高那列的高度,其他比这列矮的列会用它们的padding-bottom补偿这部分高度差。(2)利用table-cell所有单元格高度都相等的特性,来实现多列等高。(3)利用原创 2020-12-08 10:25:50 · 207 阅读 · 0 评论 -
CSS面试题11-16
11.position 的值 relative 和 absolute 定位原点是?相关知识点:absolute生成绝对定位的元素,相对于值不为static的第一个父元素的padding box进行定位,也可以理解为离自己这一级元素最近的一级position设置为absolute或者relative的父元素的padding box的左上角为原点的。fixed(老IE不支持)生成绝对定位的元素,相对于浏览器窗口进行定位。relative生成相对定位的元素,相对于其元素本身所在正常位置进原创 2020-12-08 10:04:05 · 148 阅读 · 0 评论 -
CSS相关面试题6-10
6.CSS 优先级算法如何计算?相关知识点:CSS的优先级是根据样式声明的特殊性值来判断的。选择器的特殊性值分为四个等级,如下:(1)标签内选择符x,0,0,0(2)ID选择符0,x,0,0(3)class选择符/属性选择符/伪类选择符 0,0,x,0(4)元素和伪元素选择符0,0,0,x计算方法:(1)每个等级的初始值为0(2)每个等级的叠加为选择器出现的次数相加(3)不可进位,比如0,99,99,99(4)依次表示为:0,0,0,0(5)每个等级计数之间没关联(原创 2020-12-07 16:52:20 · 135 阅读 · 0 评论 -
CSS相关面试题1-5
1.介绍一下标准的 CSS 的盒子模型?低版本 IE 的盒子模型有什么不同的?相关知识点:(1)有两种盒子模型:IE盒模型(border-box)、W3C标准盒模型(content-box)(2)盒模型:分为内容(content)、填充(padding)、边界(margin)、边框(border)四个部分IE盒模型和W3C标准盒模型的区别:(1)W3C标准盒模型:属性width,height只包含内容content,不包含border和padding(2)IE盒模型:属性width,h原创 2020-12-07 14:30:10 · 209 阅读 · 0 评论