我的位置: 首页  >   揭秘CSS  >   1.5.3 创建内联样式表

1.5.3 创建内联样式表

编辑:比特教程网    时间:2018-09-25 12:48    


内联样式表(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属性,笔者更是坚决反对使用内联样式。


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