CSS 样式表引入的3种方式

合集 - WebKit(8)

1.WebKist Inside: CSS 样式表的组成2023-10-012.WebKit Inside: DOM树的构建2022-02-213.WebKit中WTFMove实现2022-02-204.WebKit Inside: CSS 样式表解码字符集2023-09-30

5.CSS 样式表引入的3种方式2023-09-30

6.WebKit Inside: CSS 样式表的解析2023-10-027.WebKit Inside: CSS 样式表的匹配时机2023-10-058.WebKit Insie: Active 样式表2023-10-07

收起

CSS 全称为层叠样式表(Cascading Style Sheet)，用来定义 HTML 文件最终显示的外观。HTML 文件里引入 CSS 样式有3种方式: 外部样式表、内部样式表、行内样式。

外部样式表

外部样式表通过 link 标签引入:

<link rel='stylesheet' type='text/css' href='https://www.test.com/test.css' />

link 标签中的 href 属性值就是样式表的 url。

内部样式表

内部样式表通过 style 标签引入:

 <style type = 'text/css'>
        div {
            background-color:red;
            border-width: 2px;
        }
  </style>

行内样式

行内样式定义在 HTML 标签的 style 属性里:

<div style='font-size:12px;background-color:red;'>Hello, World</div>