CSS的引入方式：行内样式表（行内式）、内部样式表（嵌入式）、外部样式表（链接式）

最新推荐文章于 2025-03-15 10:24:07 发布

奶盖不加糖

最新推荐文章于 2025-03-15 10:24:07 发布

阅读量1.6w

点赞数 10

文章标签： css html

本文链接：https://blog.csdn.net/qq_44156869/article/details/108569220

版权

27 篇文章

订阅专栏

内部样式表（内嵌样式表）是写到 html 页面内部。是将所有的CSS代码抽取出来，单独放到一个 <style>标签中。

<head>
  <style>
    div {
      color: red;
      font-size: 12px;
    }
  </style>
</head>
<body>
  <div>开心</div>
</body>

行内样式表（内联样式表）是在元素标签内部的style属性中设定CSS样式。适合于修改简单样式。

<body>
  <div style="color:pink; font-size: 12px;">开心</div>
</body>

实际开发都是外部样式表，适合样式比较多的情况。

核心是：样式单独写到CSS文件中，之后把CSS文件引入到 HTML 页面中使用。

引入外部样式表分为两步：

1.新建一个后缀为 .CSS的样式，把所有CSS代码都放入此文件中。

2.HTML页面中，使用<link>标签引入这个文件。

<link rel="stylesheet"  href="css文件路径">

属性	作用
rel	定义当前文档与被链接文档之间的关系，在这里需要指定为"stylesheet"，表示被链接的文档是一个样式文件。
href	定义所链接外部样式表文件的URL，可以是相对路径，也可以是绝对路径。