浮动相关试题

275 阅读2分钟

1.浮动元素有什么特征?对父容器、其他浮动元素、普通元素、文字分别有什么影响?

点我

2.清除浮动指什么?如何清除浮动? 两种以上方法。

在非IE浏览器(如Firefox)下,当容器的高度为auto,且容器的内容中有浮动(float为left或right)的元素,在这种情况下,容器的高度不能自动伸长以适应内容的高度,使得内容溢出到容器外面而影响(甚至破坏)布局的现象。这个现象叫浮动溢出,为了防止这个现象的出现而进行的CSS处理,就叫CSS清除浮动。

* 使用带clear属性的空元素(如下图)

* 使用CSS的overflow属性

给浮动元素的容器添加overflow:hidden;或overflow:auto;可以清除浮动

3.有几种定位方式?分别是如何实现定位的?参考点是什么?使用场景是什么?

*默认static:没有定位。

*absolute:绝对定位。

*relative:相对定位,相对于原始位置进行定位,常用于布局,让子元素有参考对象。

*fixed:生成绝对定位的元素,常用于广告弹窗等。

absolute:以定位为relative的父或祖先元素为参考点,如果没有会以body作为参考点偏移。

relative:以自身正常位置为参考点偏移。

fixed:以浏览器窗口为参考点偏移。

注:网上找到的图 供我参考 侵删

4.z-index 有什么作用? 如何使用?

可以解决元素的覆盖问题,决定哪个元素在上方,哪个在下方。也可以为负数,z-index数高的在上面。

5.实现如下导航栏效果 :

查看效果,在下方附上线上预览地址 http://127.0.0.1:8080

js.jirengu.com/nojufoxavo/…

6.把下面的话抄写三遍;

如果用了浮动,其父元素一般(最好)需要清除浮动。
如果用了绝对定位,一般(最好)要给参考点设置position:relative。

如果用了浮动,其父元素一般(最好)需要清除浮动。

如果用了绝对定位,一般(最好)要给参考点设置position:relative。

如果用了浮动,其父元素一般(最好)需要清除浮动。

如果用了绝对定位,一般(最好)要给参考点设置position:relative。

如果用了浮动,其父元素一般(最好)需要清除浮动。

如果用了绝对定位,一般(最好)要给参考点设置position:relative。