CSS文本属性基础教程：line-height, text-decoration与text-indent详解

在"从零学CSS系列之文本属性"的文章中，我们深入探讨了CSS中的三个关键文本属性：line-height、text-decoration以及text-indent。这些属性对于网页布局和样式控制起着至关重要的作用。 首先，line-height属性用于控制元素内文本行间距。它不仅允许为元素指定一个无单位的缩放因子，如在示例中，通过设置`body{font-size:12px; line-height:1.5;}`，文本会根据字号自动调整行高。后代元素会继承这个基础行高，但使用em或百分比等相对单位时，也会计算出实际的行高值。尽管text-decoration（文本修饰）是非继承属性，但祖先元素的修饰效果可以通过设置`text-decoration:none;`来清除，但在处理复杂结构时，应避免直接修改父元素的属性，以减少兼容性问题。 文本修饰的另一个例子是下划线，`<p>`元素的下划线可以通过设置`text-decoration: underline;`来实现，而要取消子元素的下划线，需要像`<pspan>`那样单独设置`text-decoration:none;`。然而，文本修饰的"延伸"特性可能会导致布局混乱，因此推荐针对需要修饰的部分直接应用属性，以保持清晰的样式控制。 text-indent属性则用来设置文本的首行缩进，可以使用像素值（如`text-indent:2em;`表示2个字符）或绝对值（负数值用于悬挂式缩进）。这个属性尤其在控制段落格式和美化文本呈现上非常实用，例如创建对齐引号或者创建视觉上的空白区域，以便突出主要内容。 理解并熟练运用这些CSS文本属性能够帮助你更好地控制网页的排版和视觉效果，提高设计的灵活性和可维护性。在实践中，结合具体的设计需求，灵活运用这些属性，能让你的网页设计更加专业且具有吸引力。