一、行内样式
<p style="color:#FF0000;font-size:20px;text-decoration:underline;">正文内容</p>
二、内嵌式
<html>
<head>
<title>
网页标题
</title>
<!-- 此处不是代表代码被注释了。如果有浏览器不识别此CSS,则表示注释
<style>
p{
color:#FFOOFF;
text-decoration:underline;
font-size:25px;
font-weight:bold
}
</style>
-->
</head>
<body>
<p>正文1</p>
<p>正文2</p>
</body>
</html>
三、链接式
<html>
<head>
<title>
网页标题
</title>
<link href="1.css" type="text/css" rel="stylesheet">
</head>
<body>
<p>正文1</p>
<p>正文2</p>
</body>
</html>
四、导入式
<html>
<head>
<title>
网页标题
</title>
<style type="text/css">
@import url(1.css);
@import url(2.css);<!--可同时导入多个样式表,也在样式表中导入其他样式表-->
</style>
</head>
<body>
<p>正文1</p>
<p>正文2</p>
</body>
<p style="color:#FF0000;font-size:20px;text-decoration:underline;">正文内容</p>
二、内嵌式
<html>
<head>
<title>
网页标题
</title>
<!-- 此处不是代表代码被注释了。如果有浏览器不识别此CSS,则表示注释
<style>
p{
color:#FFOOFF;
text-decoration:underline;
font-size:25px;
font-weight:bold
}
</style>
-->
</head>
<body>
<p>正文1</p>
<p>正文2</p>
</body>
</html>
三、链接式
<html>
<head>
<title>
网页标题
</title>
<link href="1.css" type="text/css" rel="stylesheet">
</head>
<body>
<p>正文1</p>
<p>正文2</p>
</body>
</html>
四、导入式
<html>
<head>
<title>
网页标题
</title>
<style type="text/css">
@import url(1.css);
@import url(2.css);<!--可同时导入多个样式表,也在样式表中导入其他样式表-->
</style>
</head>
<body>
<p>正文1</p>
<p>正文2</p>
</body>
</html>
这四种方式可同时使用,当多种方式对修饰同一对象时,是有优先级的,从高到低依次 行内样式、链接式,内嵌式,导入式。