怎么链接外部css
时间: 2023-10-25 07:17:41 浏览: 27
要将外部 CSS 文件链接到 HTML 页面中,需要使用 `<link>` 标签。具体步骤如下:
1. 在 HTML 文件的 `<head>` 标签内部添加一个 `<link>` 标签,用于引入 CSS 文件。
2. 在 `<link>` 标签中设置 `rel` 属性为 `"stylesheet"`,表示这是一个样式表文件。
3. 在 `<link>` 标签中设置 `type` 属性为 `"text/css"`,表示文件类型为 CSS。
4. 在 `<link>` 标签中设置 `href` 属性为 CSS 文件的路径,可以是相对路径或绝对路径。
以下是示例代码:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>My Website</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<!-- 页面内容 -->
</body>
</html>
```
上述代码中,`href` 属性的值为 `"style.css"`,表示 CSS 文件与 HTML 文件在同一目录下。如果 CSS 文件在其他目录下,需要在 `href` 属性中指定完整的路径。
相关问题
引用外部css
在 HTML 页面中,可以使用以下方式引用外部 CSS 文件:
1. 在 <head> 标签中使用 <link> 标签引用外部 CSS 文件。例如:
```html
<html>
<head>
<title>My Page</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>My Heading</h1>
<p>My paragraph.</p>
</body>
</html>
```
其中,style.css 是存储 CSS 样式的外部文件。href 属性指定了 CSS 文件的路径和文件名。
2. 在 HTML 页面的 <style> 标签中写入 CSS 样式。例如:
```html
<html>
<head>
<title>My Page</title>
<style>
h1 {
color: red;
}
p {
font-size: 16px;
}
</style>
</head>
<body>
<h1>My Heading</h1>
<p>My paragraph.</p>
</body>
</html>
```
其中,<style> 标签用于定义 CSS 样式。在 <style> 标签中可以写入 CSS 代码。
请注意,为了保证 CSS 样式能够正确地引用和执行,需要确保 CSS 文件的文件路径和文件名正确。另外,还需要遵循浏览器的安全策略,如同源策略等。
html引入外部css
在 HTML 中,你可以通过使用 `<link>` 标签来引入外部的 CSS 文件。具体操作如下:
1. 在 HTML 文档中 head 标签内添加一个 link 标签,如下所示:
```html
<head>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
```
其中,`rel` 属性指定关系,`type` 属性指定文件类型,`href` 属性指定外部 CSS 文件的 URL。
2. 在与 HTML 文件相同的目录下创建一个名为 `styles.css` 的 CSS 文件,并将样式代码写在其中。
这样,HTML 就会自动加载并应用 `styles.css` 中的样式。