欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

在html中引入css的三种方式

程序员文章站 2022-07-11 12:01:18
...
1. 行间样式的设置:给单独的标签设置样式。


<div style="width:100px;hight:300px;background-color:ponk;"></div>

缺点:代码只能应用在一行标签中无法重复使用


2.内部样式
语法:在head标签中的style标签中设置样式。

例如
<html>
<head>
<meta charset="UTF-8" />
<--! 内部样式 -->
<style>
div{
width:100px;
height:100px;
background-color:pink;
}
</style>
<title></title>
</head>
<body>
<div>内容</div>
</body>
</html>

缺点:仅仅适用于当前网页,如果遇到多个网页就会很麻烦

3. 外部样式表
定义:在外部文件中书写css样式。
<html>
<head>
<meta charset="UTF-8">
<title>我的css网页</title>
<link rel="stylesheet" href="css.css" />
</head>
<body>
<div>
123456789
</div>
</body>
</html>



css文件:
div{
width: 100px;
height: 100px;
background: blue;
}