css怎么和html连接起来
发布时间:2023-05-30 14:57:00
发布人:zyh
要将CSS和HTML连接起来,可以通过以下几种方式:
1. 内部样式表:在HTML文档的`head`标签中使用`style`标签定义CSS样式,这样可以让CSS代码嵌入到HTML文档中。
例如:
<!DOCTYPE html>
<html>
<head>
<title>My Page</title>
<style>
body { background-color: #f0f0f0; }
h1 { color: red; }
</style>
</head>
<body>
<h1>My Page</h1>
<p>Hello World!</p>
</body>
</html>
2. 外部样式表:创建一个独立的CSS文件,然后在HTML文档的`head`标签中使用`link`标签引用它。
例如:
body { background-color: #f0f0f0; }
h1 { color: red; }
在 HTML 文件中:
<!DOCTYPE html>
<html>
<head>
<title>My Page</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>My Page</h1>
<p>Hello World!</p>
</body>
</html>
3. 行内样式: 在标签中使用`style`属性定义CSS样式。不过这种方法不太推荐,因为它会导致代码难以维护。
例如:
<!DOCTYPE html>
<html>
<head>
<title>My Page</title>
</head>
<body>
<h1 style="color: red;">My Page</h1>
<p style="background-color: #f0f0f0;">Hello World!</p>
</body>
</html>
总之,以上三种方式都可以将CSS和HTML进行连接,需要根据实际情况进行选择和应用。
下一篇css的基本选择器有几种