<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"> span{ color: yellow; } </style> <link rel="stylesheet" href="./index.css"> <style> @import url(./index.css); </style> </head> <body> <!-- 1 行内样式 直接在标签内定义样式 2 内接样式 在head里定义style 3 外接样式 3.1 链接式 <link rel="stylesheet" href="./index.css"> 3.2 导入式 <style> @import url(index.css); </style> --> <div> <p style="color: green;">我是一个段落</p> </div> <div> <div> <span>我是另一个段落</span> <a href="#">火影忍者</a> </div> </div> </body> </html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
span{
color: yellow;
}
</style>
<link rel="stylesheet" href="./index.css">
<style>
@import url(./index.css);
</style>
</head>
<body>
<!--
1 行内样式 直接在标签内定义样式
2 内接样式 在head里定义style
3 外接样式
3.1 链接式
<link rel="stylesheet" href="./index.css">
3.2 导入式
<style>
@import url(index.css);
</style>
-->
<div>
<p style="color: green;">我是一个段落</p>
</div>
<div>
<div>
<span>我是另一个段落</span>
<a href="#">火影忍者</a>
</div>
</div>
</body>
</html>
原文：https://www.cnblogs.com/Nopeeee/p/10001350.html