CSS(三) ● 如果想要改变一个DOM元素的字体颜色,不在它本身上进行操作? ● line-height和height的区别 ● 设置一个元素的背景颜色,背景颜色会填充哪些区域? ● 知道属性选择器和伪类选择器的优先级吗 ● inline-block、inline和block的区别;为什么img是inline还可以设置宽高 ● 了解重绘和重排吗,知道怎么去减少重绘和重排吗,让文档脱离文档流有哪些方法 ● overflow的原理 ● 两个嵌套的div,position都是absolute,子div设置top属性,那么这个top是相对于父元素的哪个位置定位的。 ● css预处理器有什么


可以更改父元素的color

● line-height和height的区别

line-height一般是指布局里面一段文字上下行之间的高度,是针对字体来设置的,height一般是指容器的整体高度,

● 设置一个元素的背景颜色,背景颜色会填充哪些区域?

background-color设置的背景颜色会填充元素的contentpaddingborder区域,在我们border没有设置颜色的时候,会由背景颜色来充当,当我们设置了颜色之后会由border-color来充当。

● 知道属性选择器和伪类选择器的优先级吗

属性选择器和伪类选择器优先级相同

● inline-block、inline和block的区别;为什么img是inline还可以设置宽高

  • Block是块级元素,其前后都会有换行符,能设置宽度,高度,margin/padding水平垂直方向都有效。
  • Inline:设置width和height无效,margin在竖直方向上无效,padding在水平方向垂直方向都有效,前后无换行符
  • Inline-block:能设置宽度高度,margin/padding水平垂直方向 都有效,前后无换行符

● 了解重绘和重排吗,知道怎么去减少重绘和重排吗,让文档脱离文档流有哪些方法

DOM的变化影响到了预算内宿的几何属性比如宽高,浏览器重新计算元素的几何属性,其他元素的几何属性也会受到影响,浏览器需要重新构造渲染书,这个过程称之为重排,浏览器将受到影响的部分重新绘制在屏幕上 的过程称为重绘,
引起重排重绘的原因有:

  • 添加或者删除可见的DOM元素,
  • 元素尺寸位置的改变
  • 浏览器页面初始化,
  • 浏览器窗口大小发生改变,重排一定导致重绘,重绘不一定导致重排,

减少重绘重排的方法有:

  • 不在布局信息改变时做DOM查询,
  • 使用csstext,className一次性改变属性
  • 使用fragment
  • 对于多次重排的元素,比如说动画。使用绝对定位脱离文档流,使其不影响其他元素

● overflow的原理

当元素设置了overflow样式且值部位visible时,该元素就构建了一个BFC,BFC在计算高度时,内部浮动元素的高度也要计算在内,也就是说技术BFC区域内只有一个浮动元素,BFC的高度也不会发生塌缩,所以达到了清除浮动的目的,

● 两个嵌套的div,position都是absolute,子div设置top属性,那么这个top是相对于父元素的哪个位置定位的。

margin的外边缘

● css预处理器有什么

less,sass等