CSS 代码既能存放在一个独立的.css文件，也能直接嵌套到 HTML 代码中运行，总共有三种执行方式。
<html>
<head>
<link rel="stylesheet" type="text/css" href="path_to/style.css"> <!-- 1. CSS 文件载入 -->
</head>
<style type="text/css"> <!-- 2. <style> 标签载入 -->
p {
color: red;
}
</style>
<body>
<p style="color: red">cascading style sheets</p> <!-- 3. style 属性载入 -->
</body>
</html>不同执行 CSS 代码的方式，有不同的优先级别。
<style type="text/css">
p {
color: yellow;
color: green; <!-- 定义相同的样式会把之前的样式覆盖 -->
}
</style>
<p style="color: red;"> hello </p> <!-- 属性定义样式的优先级最高 -->如果想让属性保持最高的优先级别，可以使用 important 属性进行级别提升。
<style type="text/css">
p {
color: yellow!important; <!-- 强制优先 -->
color: red; <!-- 无效 -->
}
</style>
<p style="color: red;"> hello </p> <!-- 无效 -->有一些样式属性，比如 字体 / 颜色 等在父类中定义之后，会继承到子类。但具备继承性质的属性很有限，就那么几个，这时可能需要用到 inherit 强行继承。
<p style="color: red;">
<strong> hello </strong> <!-- strong 自动继承了 p 的字体颜色 -->
</p>
<p style="border: 1px solid orange">
<strong style="border: inherit"> hello </strong> <!-- 强制继承父类的边框效果 -->
</p>.css 文件的注释语法是 /* */。
p {
color: red; /* 颜色红色 */
}