1.2 CSS面试题

面试题：介绍一下CSS的盒子模型

CSS的盒子模型有哪些：标准盒子模型、IE盒子模型
CSS的盒子模型区别：
    标准盒子模型：margin、border、padding、content
    IE盒子模型 ：margin、content（ border +  padding  + content ）
通过CSS如何转换盒子模型：
    box-sizing: content-box;    /*标准盒子模型*/
    box-sizing: border-box;   /*IE盒子模型*/
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.

面试题：line-height和heigh区别【大厂】

line-height是每一行文字的高，如果文字换行则整个盒子高度会增大（行数*行高）。
height是一个死值，就是这个盒子的高度。
  • 1.
  • 2.

面试题：CSS选择符有哪些？哪些属性可以继承？

CSS选择符：
    通配（*）
    id选择器（#）
    类选择器（.）
    标签选择器（div、p、h1...）
    相邻选择器(+)
    后代选择器(ul li)
    子元素选择器（ > ）
    属性选择器(a[href])
    
CSS属性哪些可以继承：
		文字系列：font-size、color、line-height、text-align...
***不可继承属性：border、padding、margin...
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.

面试题：CSS优先级算法如何计算？

优先级比较：!important > 内联样式 > id > class > 标签 > 通配
  • 1.
CSS权重计算：
第一：内联样式（style）  权重值:1000
第二：id选择器  				 权重值:100
第三：类选择器 				  权重值:10
第四：标签&伪元素选择器   权重值:1
第五：通配、>、+         权重值:0
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.

面试题：用CSS画一个三角形

用边框画（border）,例如：
{
		width: 0;
		height: 0;

		border-left:100px solid transparent;
		border-right:100px solid transparent;
		border-top:100px solid transparent;
		border-bottom:100px solid #ccc;
}
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.