html链接css代码怎么写

作者：妳會吥會在吥經意間想起莪？发布日期:2026-08-03 浏览:96

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>HTML链接CSS示例</title>
    <!-- 链接外部CSS文件 -->
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <h1>这是一个HTML页面</h1>
    <p>这里有一些文本。</p>
</body>
</html>

解释说明：

<link rel="stylesheet" href="styles.css">：这行代码用于将外部的CSS文件链接到HTML文档中。rel="stylesheet" 表示链接的是一个样式表，href="styles.css" 指定了CSS文件的路径。

如果你希望直接在HTML文件中写入CSS代码，可以使用<style>标签：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>HTML内联CSS示例</title>
    <style>
        body {
            background-color: lightblue;
        }
        h1 {
            color: navy;
        }
        p {
            color: red;
        }
    </style>
</head>
<body>
    <h1>这是一个HTML页面</h1>
    <p>这里有一些文本。</p>
</body>
</html>

解释说明：

<style> 标签用于在HTML文档的<head>部分定义内部CSS样式。
在<style>标签内，你可以编写CSS规则来设置页面元素的样式。

上一篇：html在线转换

下一篇：html单选按钮