CSS3 核心知识面试题

 

一种常见利用伪类清除浮动的代码

.clearfix:after {
content:"."; //这里利用到了content属性
display:block;
height:0;
visibility:hidden;
clear:both; 
}
.clearfix {
*zoom:1;
}

 

box-sizing属性?

用来控制元素的盒子模型的解析模式,默认为content-box

context-box:W3C的标准盒子模型,设置元素的 height/width 属性指的是content部分的高/宽

border-box:IE传统盒子模型。设置元素的height/width属性指的是border + padding + content部分的高/宽

CSS优先级算法如何计算?
元素选择符: 1
class选择符: 10
id选择符:100
元素标签:1000
!important声明的样式优先级最高

 

用纯CSS创建一个三角形的原理是什么?

首先,需要把元素的宽度、高度设为0。然后设置边框样式。
width: 0;
height: 0;
border-top: 40px solid transparent;
border-left: 40px solid transparent;
border-right: 40px solid transparent;
borer-bottom: 40px solid #ff0000;

 

设置元素浮动后,该元素的display值是多少?

自动变成display:block

 

解释该div高度的意思:height: calc(50vh - 100px)

less预编译写法:height: calc(~‘50vh - 100px’) 或 height: ~‘calc(50vh - 100px)’

 

在网页中的应该使用奇数还是偶数的字体?为什么呢?

使用偶数字体。偶数字号相对更容易和 web 设计的其他部分构成比例关系。Windows 自带的点阵宋体(中易宋体)从 Vista 开始只提供 12、14、16 px 这三个大小的点阵,而 13、15、17 px时用的是小一号的点。(即每个字占的空间大了 1 px,但点阵没变),于是略显稀疏。

 

上一篇:html5-深入浅出(1)


下一篇:HTML/CSS中,DIV高度自适应解决办法