CSS3浮动技术的原始设计目的是 ( )。
实现PC端复杂的多栏布局
实现页面元素的绝对居中
让文字环绕图片
创建网格系统
当一个元素设置为float:left;后，其表现类似于 ( )。
行内元素（inline）
内联块元素（inline-block）
块级元素（block）
表格元素（table）
下列关于浮动元素特性的描述，正确的是 ( )。
浮动元素完全脱离文档流，不占据任何空间
浮动元素会脱离正常的文档流，但文本内容会环绕其周围
浮动元素不会影响后续任何元素的布局
浮动元素无法设置宽度和高度
浮动元素会一直移动，直到其外边缘碰到 ( ) 为止。
浏览器视口的边框
父容器的内边距边缘
父容器的边框或另一个浮动元素的边框
页面的body元素
在CSS3中， ( ) 是float属性的有效值。
center
top
bottom
inherit
当父元素内的所有子元素都浮动时，可能导致的最常见问题是 ( )。
子元素无限循环
父元素高度塌陷
浏览器崩溃
子元素自动变为绝对定位
在下列选项中， ( ) 不是常用的清除浮动以解决父元素高度塌陷的方法。
为父元素设置overflow:hidden;
在浮动元素后添加一个设置clear:both;的空标签
为父元素设置position:relative;
使用.clearfix::after伪元素
下列关于相对定位（position:relative;）的描述，正确的是 ( )。
元素脱离文档流，原空间被释放
元素相对于浏览器视口进行定位
元素相对于自身在文档流中的原始位置进行偏移
元素必须设置top属性和left属性才能生效
绝对定位（position:absolute;）元素的定位基准点是 ( )。
文档的body元素
其直接父元素，无论父元素是否定位
最近一个定位（非static）的祖先元素
浏览器视口的左上角
若要将一个元素固定在浏览器视口，不随页面滚动，则应使用 ( )。
position: static;
position: relative;
position: absolute;
position: fixed;
层叠顺序属性z-index对以下哪种position值的元素有效？ ( )
static
relative
对所有position值都有效
仅对fixed有效
当同时设置top:10px;和bottom:20px;时，一个position:absolute;元素最终会如何偏移？ ( )
同时应用top属性和bottom属性
bottom属性优先级更高
top属性优先级更高
产生冲突，元素不显示
如何为一个元素建立定位上下文，使其成为内部position:absolute;子元素的参照容器？ ( )
为该元素设置float:left;
为该元素设置position:static;
为该元素设置position:relative;（不设置偏移）
为该元素设置z-index:1;
当使用固定定位（position:fixed;）实现顶部导航栏时，常遇到的副作用是 ( )。
导航栏无法单击
导航栏后面的主要内容被遮盖
导航栏颜色改变
页面无法滚动
要实现一个元素在已定位的父容器内水平、垂直均居中，常用的方法是 ( )。
margin: auto;
position: relative; top: 50%; left: 50%;
position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
float: center;
浮动布局相比Flexbox布局或Grid布局，在现代网页开发中的主要定位是 ( )。
主流的、首选的布局方案
已完全被淘汰的技术
主要用于维护遗留项目或简单的图文环绕
实现三维效果的核心技术
粘性定位（position:sticky;）要生效，必须设置 ( ) 属性。
z-index
至少一个方向（top/right/bottom/left）的阈值
display:table;
float:none;
下列关于清除浮动技术中伪元素法的描述，正确的是 ( )。
原理是为父元素添加一个看不见的块级元素并清除两侧浮动元素
会显著增加页面的HTML标签数量
代码不可复用，每个地方都需要重写
必须配合overflow属性使用
当一个元素设置为position:absolute;后，该元素对兄弟元素布局的影响是 ( )。
向左侧挤压兄弟元素
使其后的兄弟元素上移，占据它原来的空间
使其前的兄弟元素下移
对兄弟元素没有任何影响
使元素向左浮动的CSS3属性声明是float:____;。
使元素相对于浏览器视口进行定位的position属性值是____。
若要使一个position:absolute;的子元素能够相对于其父元素定位，通常需要为父元素设置position:____;。
浮动元素会完全脱离文档流，导致父元素高度塌陷，且所有后续内容都无法感知到它的存在。
position:relative;的元素在进行偏移后，其在文档流中原本占据的空间会被保留。
position:absolute;的元素默认是相对于<body>标签的左上角进行定位的。
z-index属性可以应用于任何HTML元素，无论其是否定位。
当使用float属性实现多栏布局时，各栏宽度的总和可以略微超过父容器的宽度。
请简述浮动元素导致父容器高度塌陷的原因，并写出至少两种解决方法。
解释position:relative;和position:absolute;的主要区别，并举例说明各自的应用场景。
使用浮动技术实现一个包含header、左侧导航栏（宽度为200px）、主内容区和footer的三栏布局，要求左侧导航栏和主内容区并排显示，footer在最底部。
编写CSS3代码，使用position:relative;和position:absolute;相结合的方式，实现一个图片上方叠加文字说明的效果。