CSS基础知识

1.行内级元素可以设置宽高吗?

  置换元素可以,非置换元素不可以。

  不会为自身内容形成新的块,而让内容分布在多行中的元素叫做行内级元素。此类元素可以与其它行内级元素在同一行中显示而不会另起一行,例如span,strong。在面试时,当被问到行内级元素可否设置宽高时,根据我们的经验往往会回答不能。但是这样往往着了面试官的道,因为有一些特殊的行内元素,比如img,input,select等等,是可以被设置宽高的。一个内容不受CSS视觉格式化模型控制,CSS渲染模型并不考虑对此内容的渲染,且元素本身一般拥有固有尺寸(宽度,高度,宽高比)的元素,被称之为置换元素。比如img是一个置换元素,当不对它设置宽高时,它会按照本身的宽高进行显示。所以这个问题的正确答案应该是置换元素可以,非置换元素不可以

参考博客:CSS十问——好奇心+刨根问底=CSSer

2.清除浮动的方法

子元素浮动后,父容器高度塌陷:高度塌陷,父容器包不住子元素

参考博客:清除浮动的七种方法

                几种常用的清除浮动方法   

               常见Web前端开发笔试题

(1)使用额外标签

 使用额外标签,这也是W3C推荐的方法。这种方法就是在内容的末尾增加一个空的标签,典型的做法就是使用类似

<br style="clear:both;" />

或者使用

<div style="clear:both;"></div>

这种办法通过增加一个HTML元素迫使外部容器撑开。不过这个办法会增加额外的标签使HTML结构看起来不够简洁。

3.ZOOM:1的原理和作用

当设置了zoom的值之后,所设置的元素就会就会扩大或者缩小,高度宽度就会重新计算了,这里一旦改变zoom值时其实也会发生重新渲染,运用这个原理,也就解决了ie下子元素浮动时候父元素不随着自动扩大的问题。

注意:Firefox不支持zoom,看不出设置zoom的值之后有放大或者缩小的结果。

参考博客:ZOOM:1的原理和作用

             CSS中两种放大zoom和scale的区别  

4.CSS :after 选择器

:after 选择器在被选元素的内容后面插入内容。

请使用 content 属性来指定要插入的内容。

 

 

原文地址:https://www.cnblogs.com/songsongblue/p/10895074.html