overflow属性专门控制元素内容超出容器尺寸时的显示方式，是布局必备属性，常用值有 5 个。默认值visible，内容溢出会直接露在容器外面，不做任何处理；hidden最常用，溢出内容直接裁剪隐藏，还能清除浮动；scroll会强制给元素添加横向和纵向滚动条，哪怕内容没溢出也会显示；auto是智能模式，只有内容溢出时才显示对应的滚动条，最贴合日常需求；clip和hidden类似，但更严格，完全禁止滚动，兼容性稍差。这个属性能解决内容溢出破坏布局的问题，适配弹窗、文本框、滚动容器等场景。
z-index的核心作用是控制元素的上下堆叠顺序，就像给元素设置楼层，数值越大越靠上，会覆盖数值小的元素。使用有个关键前提：元素必须设置定位属性（relative/absolute/fixed/sticky），静态默认元素设置无效。它遵循同级比较规则，父子元素的堆叠顺序受父级z-index约束，子元素再大也无法跳出父级层级。数值可以是正数、负数、0，默认值是auto。比如弹窗、导航吸顶、悬浮按钮，都会用高z-index保证显示在最上层，避免被其他元素遮挡。
两者都能实现透明效果，但作用范围天差地别。opacity是元素级属性，取值 0-1，会让整个元素包括背景、文字、子元素、边框全部变成半透明，且透明度会被子元素继承。而rgba()是颜色函数，只作用于单一的颜色属性，比如背景色、文字颜色，只让目标颜色透明，元素本身、文字内容、子元素完全不受影响。举个例子：给盒子设opacity:0.5，里面的文字会跟着半透；设background:rgba(0,0,0,0.5)，只有背景半透，文字依旧清晰。开发中优先用rgba，避免影响子元素。
CSS 有多种方式控制元素显隐，适用场景各不相同。最常用的display:none，会让元素彻底从页面消失，不占用空间，也无法交互；visibility:hidden，元素只是看不见，但保留原有位置，不影响布局；opacity:0，元素完全透明，占位且可以被点击、触发交互；还可以用clip-path裁剪隐藏、position把元素移到屏幕外。显示元素只需恢复对应值：display:block/inline、visibility:visible、opacity:1。日常开发，需要完全移除元素用display，需要占位隐藏用visibility，需要透明交互用opacity。
这两个属性是最常用的隐藏方式，核心区别在是否占用页面空间。display:none会让元素彻底移除，不占据文档流位置，页面布局会重新排列，且元素无法触发交互、动画，浏览器不会渲染它。visibility:hidden只是让元素视觉上不可见，元素的宽高、位置完全保留，页面布局不变，子元素可以通过设置visibility:visible单独显示，还能执行动画。从性能看，display会触发页面重排重绘，visibility只触发重绘，开销更小。简单记：要占位用visibility，不占位用display。
控制可见性用display、visibility、opacity等属性，而可访问性要兼顾屏幕阅读器，不能只做视觉隐藏。纯视觉隐藏：用opacity:0、visibility:hidden，元素占位可交互；彻底隐藏：display:none，阅读器也会忽略元素。可访问性隐藏是重点：需要视觉上看不见，但能被阅读器读取，常用sr-only类，通过clip、position、overflow组合实现，适合图标按钮的文字说明。要注意：opacity:0的元素可被点击，visibility:hidden会被阅读器忽略，区分场景使用，保证网页适配特殊人群。
line-height行高是文本排版的核心属性，直接决定页面可读性和美观度，还能实现文本垂直居中，重要性极高。它控制文本行之间的垂直间距，网页正文最佳行高是 1.5-1.6 倍，阅读最舒适。使用时优先用无单位数值，比如line-height:1.5，子元素会继承比例，不会出问题；用 px、百分比会继承固定值，容易出错。单行文本垂直居中，直接把行高设为容器高度即可。它还能调整文本的视觉高度，让排版不拥挤，不管是标题、正文还是按钮文字，都离不开行高的适配。
