一、请解释 inline 和 inline-block 的区别?
行内元素和行内块级元素,最基本的区别就是inline元素不能设置宽高边距,inline-block则可以,block是块级元素是独占一行的,inline-block就是能放在一行的block。关于这个问题,低版本的ie是有bug的,通过再次设置display为inline可以解决。
div{
display:inline-block;
}
div{
display:inline;
}
二、请解释 relative、fixed、absolute 和 static 元素的区别
relative相对于自己
fixed相对于浏览器
absolute相对于第一个非static的父级元素
static无定位
1、static(静态定位):默认值。没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明)。
2、relative(相对定位):生成相对定位的元素,通过top,bottom,left,right的设置相对于其正常(原先本身)位置进行定位。可通过z-index进行层次分级。无论父级存在不存在,无论有没有TRBL,均是以父级的左上角进行定位,但是父级的Padding属性会对其影响
3、absolute(绝对定位):生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。可通过z-index进行层次分级。若想把一个定位属性为absolute的元素定位于其父级元素内,只有满足两个条件:第一:设定TRBL第二:父级设定Position属性
4、fixed(固定定位):生成绝对定位的元素,相对于浏览器窗口进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。可通过z-index进行层次分级。
三、CSS 中字母 'C' 的意思是叠层 (Cascading)。请问在确定样式的过程中优先级是如何决定的 (请举例)?如何有效使用此系统?
采用权值相加的方式来适配权值最高的css,具体权值:标签里写style(1000),id选择器(100),class选择器(10),标签(1),还有!important可以写在任何地方,而且优先级是最高的。
作者:Arno_z
链接:https://www.jianshu.com/p/1c314dd0ba1f
來源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。