内联 CSS 在web文档中直接插入一个CSS是内联样式的使用方法之一。使用内联样式，将CSS应用于单个元素。 为了使用内联样式，将CSS属性直接添加到相关标签中。 下面的例子展示了如何创建一个灰色背景和白色文本的段落：
<p style="color:white; background-color:gray;"> This is an example of inline styling. </p>内部样式表 在HTML页面的标题部分将内部样式定义在
<html> <head> <style> p { color:white; background-color:gray; } </style> </head> <body> <p>This is my first paragraph. </p> <p>This is my second paragraph. </p> </body> </html>外部引用CSS 通过这种方法将所有的CSS样式保存在同一个后缀名为.css的拓展文件中。 然后通过html标签在HTML页面的部分将CSS文件引入。 如下例子所示： HTML部分
<head> <link rel="stylesheet" href="example.css"> </head> <body> <p>This is my first paragraph.</p> <p>This is my second paragraph. </p> <p>This is my third paragraph. </p> </body>CSS部分：
p { color:white; background-color:gray; }尝试一下CSS的各种使用方式
<html> <head> <link type="text/css" rel="stylesheet" href="https://www.w3cschool.cn/statics/demosource/css-course-tryrun-red.css"> <style> .green{ color:green; } </style> </head> <body> <p class="red">外部引用CSS</p> <p class="green">内部样式表</p> <p style="color:blue">内联用法</p> </body> </html>CSS语法 CSS是由浏览器解释的样式规则,然后应用于文档中相应的元素。 样式规则有三个部分：选择器，属性和值。 例如，标题颜色可以定义为
h1 { color: orange; }选择器要指向需要设置样式的HTML元素。
声明块包含一个或多个用分号分隔的声明。 每个声明都包含一个由冒号分隔的属性名称和值。例如：
h2{ color: red; background: #fff; }类型选择器 最常见和易于理解的选择器是类型选择器。 该选择器以页面上的元素类型为目标。 例如，要定位页面上的所有段落：
p { color: red; font-size:130%; }CSS声明总是以分号结尾，而声明组则由大括号包围。 CSS注释 注释用于解释您的代码，并可能在您稍后编辑源代码时为您提供帮助。 浏览器会自动忽略注释。 CSS的注释如下所示： /* This is a comment */ 例子：（将原先设置红色背景色的CSS样式注释掉）
p { color: green; /* background-color: red; */ font-size: 150%; }被注释的样式是不会产生对应的效果 注释是可以跨越多行的，而且写法一样哦~ CSS级联 网页的最终外观是不同的样式结合的结果。 通过样式的三个主要来源形成一个级联： 由页面的作者创建的CSS样式 浏览器的默认CSS样式 浏览页面的用户自定义CSS样式 CSS继承 继承是指属性在页面中流动的方式。 除非另有定义，子元素通常会采用父元素的特征。 例子：
<html> <head> <style> body { color: green; font-family: Arial; } </style> </head> <body> <p> 路人甲 </p> </body> </html>