1.5.3 创建内联样式表

优质

小牛编辑

144浏览

2023-12-01

内联样式表（inline style），就是在HTML元素中，通过 style 属性定义的样式。可以为包含在 body 内部的任何元素定义 style 属性，属性的值为一条或多条声明，多条声明间用逗号隔开。如：

<!DOCTYPE HTML><html><head><meta charset="utf-8"><title>内联样式</title></head><body><p style = "color: red; font-weight: bold">这个段落将显示为红色粗体</p></body></html>

上述代码通过 p 元素的 style属性，为段落元素定义了一个内联样式，让段落中的文本以红色、粗体显示。

内联样式是所有方法中最直接的一种，但它会导致表现和内容的耦合，与CSS的表现和内容相分离的设计理念背道而驰，极大损害了样式表的优势。所以，通常不推荐使用 style属性，笔者更是坚决反对使用内联样式。

然而，事情并非总是一成不变的。如果某些样式确实只在某标签中使用一次，也可以使用行内样式。同样，如果某些样式仅仅在某文件中使用，也可以使用内嵌样式。但是，既然选择如此，日后维护这些样式所带来的痛苦，你也要默默承受。