overflow

使用 position 属性可精准控制弹窗布局，fixed 定位于视口居中适用于全屏遮罩，absolute 配合 relative 用于触发元素的下拉浮层，通过 z-index 规范层级避免冲突，设置 max-height 与 overflow-y 适配移动端滚动，确保弹窗稳定响应。 弹窗组件在网页…

高度塌陷指父容器因子元素浮动脱离文档流而无法正确计算高度，导致高度为0或不完整。可通过clear-fix技术解决，常用方法是使用伪元素::after插入并清除浮动，如.clearfix::after { content: “”; display: block; clear: …

浮动布局通过float属性实现元素脱离文档流并左右排列，常用于文字环绕、多列布局等场景；当子元素浮动时会导致父容器高度塌陷，需通过清除浮动解决。常用方法包括：添加clear:both的空标签（增加DOM负担）、使用::after伪元素清除（推荐，不污染结构）、设置overflow:hidden触发B…

响应式图片画廊应采用CSS Grid或Flexbox实现，避免使用传统浮动布局。通过CSS Grid的repeat(auto-fit, minmax())和aspect-ratio属性可创建自适应、等比例的网格结构，配合object-fit: cover确保图片不变形；Flexbox虽也可实现类似效…

设置元素全屏宽度可使用CSS的100vw单位，但需重置body的默认margin为0，以防滚动条或错位；若出现水平滚动，可改用width:100%并确保父元素全宽，或在父容器设置overflow-x:hidden，也可通过calc(100vw – 滚动条宽度)微调，常用于通栏页眉、横幅等…

核心是使用百分比宽度实现弹性布局，通过设置父容器和子元素的百分比宽度使内容自适应，配合box-sizing: border-box处理盒模型，利用calc()或预留百分比解决间距问题，并结合媒体查询适配移动端，确保布局在不同屏幕下正常显示。 使用CSS百分比宽度实现弹性布局，核心在于让元素的宽度根据…

使用Flexbox可高效实现弹窗居中、内部布局分配、按钮对齐及响应式适配。1. 外层容器设flex配合justify-content和align-items实现视口居中；2. 弹窗内部用column方向的flex布局，内容区flex:1自动填充；3. 按钮组通过justify-content控制对齐…

答案：CSS中margin合并指相邻块级元素的上下外边距取最大值而非相加，常见于普通流中无分隔的垂直margin间；可通过创建BFC、使用flex/grid布局或添加border/padding等方式防止。 在CSS布局中，margin合并（Margin Collapse）是一个常见的现象，尤其在处…

通过CSS Animation与@keyframes实现轮播图过渡效果，可采用淡入淡出或滑动动画。1. 淡入淡出：利用opacity变化，结合animation-delay错开每张图片的播放时机，形成循环切换；2. 滑动效果：使用transform: translateX配合透明度变化，定义关键帧实…

答案：浮动与行内元素结合可消除默认空白并精确控制间距。通过给行内元素设置float:left，使其脱离文本流，避免换行产生的间隙，再用margin统一调整间距，适用于导航栏等紧凑布局场景，虽需注意清除浮动影响，但在不支持Flex的环境中仍具实用价值。 在使用CSS进行布局时，浮动（float）和行内…