overflow

使用position: fixed实现弹窗遮罩，通过top:0、left:0、宽高100%覆盖视口，结合flex居中弹窗，z-index确保层级最高，JS添加body.overflow-hidden防止滚动穿透，点击遮罩关闭并恢复滚动。 使用 CSS 的 position: fixed 可以轻松实现…

浮动可用于实现多列布局，通过float使元素并排显示，配合清除浮动解决高度塌陷，结合媒体查询适配移动端，虽为传统布局方式，但在维护旧项目和理解CSS布局时仍有价值。 浮动（float）是CSS中一种传统的布局方式，虽然现代开发更多使用Flexbox或Grid，但在一些老项目或多列自适应布局中，浮动依…

使用absolute定位可实现卡片悬停效果，通过父容器设为relative，子元素用absolute精确定位，结合hover状态控制遮罩、按钮等元素的显示与位置，提升交互视觉体验。 在制作卡片悬停效果时，absolute 定位是一个非常实用的 CSS 技术。它能帮助我们精确控制元素的位置，让内容在悬…

使用CSS过渡实现按钮组动画可提升用户体验，通过宽度、透明度、transform及颜色渐变的平滑变化，结合Flexbox布局与统一缓动函数，使显示隐藏、排序切换更自然流畅。 按钮组在现代网页设计中非常常见，比如选项卡切换、工具栏操作等。为了让界面更流畅自然，使用CSS过渡（transition）来实…

答案：CSS transition 需结合 transform 和 overflow 才能实现文字滚动。方法一：hover 时用 transform: translateX 改变位置，transition 控制动画；方法二：用 @keyframes 定义从右到左的位移，animation 实现自动循…

清除浮动可解决图标排列中父容器塌陷问题，确保布局稳定；通过overflow:hidden、伪元素clear:both或使用Flexbox/Gird布局，能有效包含浮动元素并提升响应性与维护性。 在网页布局中，图标排列常通过浮动（float）实现横向排列，但浮动会脱离正常文档流，容易导致父容器高度塌陷…

外边距合并发生在块级元素垂直相邻时，包括兄弟元素、父子元素或空元素间，合并后取最大外边距值，可通过添加border、创建BFC、使用flex/grid布局或改用padding避免。 在CSS布局中，margin collapse（外边距合并）是一个常见但容易被忽视的现象。它指的是在特定情况下，两个垂…

通过 position 属性实现轮播图层叠与定位：1. 父容器 relative 配合子项 absolute 实现图片重叠；2. 使用 absolute 与 transform 定位居中底部指示器；3. 左右箭头通过 absolute 固定边缘并垂直居中，hover 时显示，提升交互。 在轮播图组件…

使用 position: sticky 可实现表格表头固定，通过设置 top: 0 使表头在滚动时粘滞显示，需避免父容器 overflow: hidden 并采用 border-collapse: separate 以确保正常生效。 在网页中处理长表格时，用户滚动页面过程中表头容易消失，影响数据查看…

position: sticky 需满足条件才能生效，结合 Flexbox 和 Grid 布局可实现固定导航、表头等交互效果，注意父容器无 overflow 限制、设置偏移值及避免 transform 影响。 在现代网页开发中，CSS布局与 position: sticky 结合使用可以实现既灵活又…