![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
#CSS面试题
Buildy_j
只是一个小白程序猿啦!
展开
-
display有哪些值?说明他们的作用。
仅列举部分: none隐藏,此元素不会被显示。 block块显示;此元素将显示为块级元素,此元素前后会带有换行符。 inline内嵌,默认。此元素会被显示为内联元素,元素前后没有换行符。 table表格显示,此元素会作为块级表格来显示(类似<table>),表格前后带有换行符。 inline-block:元素既具有block元素可以设置宽高的特性,同时又具有inline元素默认不换行的特性。 list-item:象块类型元素一样显示,并添加样式列表标记。 fl...原创 2021-09-22 01:03:17 · 474 阅读 · 0 评论 -
margin塌陷/margin折叠/margin合并如何解决?
符合两点: 1、在同个父级下的相邻子元素; 2、这些子元素的定位方式为普通流(position:relative/ static); margin在垂直方向上取绝对值最大的作为两个子元素的“公共margin”,两个子元素都按此margin执行。 消除方法: 1.把子元素设置成脱离文档流的定位(float,position:absolute/ fixed); 2.把子元素设置成inline-block. ...原创 2021-09-22 00:39:01 · 78 阅读 · 0 评论 -
清除父元素中全为脱离文档流的子元素的影响
方法一: 父元素的伪元素::after样式写如下: 如果记不清除给父元素设还是给子元素设,就看哪个元素高度height变成0了(可以加border属性来观察),就给那个元素设置下面的代码。 父元素::after{ content: ''; display: block; clear: both; } 方法二: 父元素也设置高度height。(不过一般父元素都作为包裹层wrapper,都是希望子元素撑开父元素,这么设置有点弄巧成拙的意思了) 方法三: 父元素也设置成脱离原创 2021-09-22 00:09:13 · 369 阅读 · 0 评论 -
脱离文档流的元素,display属性是否发生变化?
答:display隐式的变为block。 <!DOCTYPE html> <html lang="en"> <head> <style> span { float: left; } </style> </head> <body> <span>Lorem ipsum dolor, sit amet consectetur adi原创 2021-09-21 23:53:55 · 172 阅读 · 0 评论 -
CSS中position属性有什么定位?又有什么区别?与float同时使用时有什么影响?
position属性中的各种定位简记: absolute 生成绝对定位的元素,相对于 static 定位以外的第一个祖先元素进行定位。 fixed (老IE不支持) 生成绝对定位的元素,相对于浏览器窗口进行定位。 relative 生成相对定位的元素,相对于其在普通流中的位置进行定位。 static 默认值。 没有定位,元素出现在普通流中(忽略 top, bottom, left, right z-index 声明)。 inherit...原创 2021-09-21 23:46:31 · 259 阅读 · 0 评论