引入css样式的三种方式
程序员文章站
2022-04-28 08:05:53
...
第一种：内部样式表
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<title>寒假练习</title>
</head>
<body>
<div style="width:1000px; height:1000px; background-color:red; font-size:20px; text-align:center;">求索网工作室<div>
</body>
</html>
<!--
这是行间样式表 写在标签的style属性
属性名="属性值"
-->第二种：行间样式表
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<title>寒假练习</title>
<style>
#div1{width:1000px;
height:1000px;
background-color:red;
font-size:20px;
text-align:center;
}
</style>
</head>
<body>
<div id="div1">求索网工作室<div>
</body>
</html>
<!--
这是内部样式表 写在页面内部，专门的style标签里
id="id名" #id名{} ！！！同一个页面ID不能重名的
-->第三种：外部样式表
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<title>寒假练习</title>
<link href="3.css" rel="stylesheet" />
</head>
<body>
<div id="div1">求索网工作室<div>
</body>
</html>
<!--
这是外部样式表 写在单独css里边，通过link引入当前页面
<link href="样式表的路径" rel="stylesheet" />
-->
css样式：#div1{width:1000px;
height:1000px;
background-color:red;
font-size:20px;
text-align:center;
}
总之，三种样式表都可以。但是外部样式表比较方便灵活，易改动。
制作复杂的网页首选。