第三部分 CSS
· 介绍一下标准的CSS的盒子模型?与低版本IE的盒子模型有什么不同的?
· CSS盒子模型:由四个属性组成的外边距(margin)、内边距(padding)、边界(border)、内容区(width和height);
· 标准的CSS盒子模型和低端IE CSS盒子模型不同:宽高不一样
· 标准的css盒子模型宽高就是内容区宽高;
· 低端IE css盒子模型宽高 内边距﹢边界﹢内容区;
· CSS选择符有哪些?哪些属性可以继承?
类型选择符(body)、群组选择符(h1,h2,h3,span)、包含选择符(h2 span)、ID选择符(#id)、Class选择符(.content)
CLASS属性,伪类A标签,列表ul、li、dl、dd、dt可以继承
· position的值relative和absolute定位原点是?
absolute :生成绝对定位的元素, 相对于最近一级的 定位不是 static 的父元素来进行定位。
fixed (老IE不支持)生成绝对定位的元素,通常相对于浏览器窗口或 frame 进行定位。
relative 生成相对定位的元素,相对于其在普通流中的位置进行定位。
static 默认值。没有定位,元素出现在正常的流中
sticky 生成粘性定位的元素,容器的位置根据正常文档流计算得出
· 如何居中div?如何居中一个浮动元素?如何让绝对定位的div居中?
Margin 0 auto
#dingwei{padding:10px;background-color:#003300;color:#FFFFFF;
width:600px;height:300px;
display:block;
position: absolute;
top:50%;
left:50%;
margin-left:-300px;
margin-top:-150px;}
· CSS权重优先级是如何计算的?
!import > id > class > tag
• 请解释一下为什么会出现浮动和什么时候需要清除浮动?清除浮动的方式
浮动float最开始出现的意义是为了让文字环绕图片而已,但人们发现,如果想要三个块级元素并排显示,都给它们加个float来得会比较方便
清除浮动是指清除由于子元素浮动带来父元素高度塌陷的影响。
1.三个div 水平排列,需要用到浮动,但如果用一个边框包起来,由于使用了浮动不能实现,就需要清除浮动 clear:both
2,采用伪元素
zoom:1清除浮动原理:清除浮动,触发hasLayout;Zoom属性是IE浏览器的专有属性,它可以设置或检索对象的缩放比例。解决ie下比较奇葩的bug。譬如外边距(margin)的重叠,浮动清除,触发ie的haslayout属性等。来龙去脉大概如下:当设置了zoom的值之后,所设置的元素就会就会扩大或者缩小,高度宽度就会重新计算了,这里一旦改变zoom值时其实也会发生重新渲染,运用这个原理,也就解决了ie下子元素浮动时候父元素不随着自动扩大的问题。Zoom属是IE浏览器的专有属性,火狐和老版本的webkit核心的浏览器都不支持这个属性。然而,zoom现在已经被逐步标准化,出现在 CSS 3.0 规范草案中。目前非ie由于不支持这个属性,它们又是通过什么属性来实现元素的缩放呢?可以通过css3里面的动画属性scale进行缩放。
网友评论