![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
天蓬老师Correction status：qualified
Teacher's comments：作业完成的很棒, 当然离优秀还有差距, 能学到新知识最重要
Collection
Collection
Hello！ 大家好！欢迎来到php中文网，我是 酒淋后！今天要给大家分享的是 CSS元素样式来源以及实例演示，不要走，结尾有惊喜！
| 英文全称 | 中文含义 | 作用 |
|---|---|---|
| Cascading Style | 层叠样式表 | 美化页面及优化页面交互使用 |
a、行内样式就是直接把 CSS 代码添加到 HTML 的标记中，即作为 HTML 标记的属性标记存在。通过这种方法，可以很简单地对某个元素单独定义样式。
b、设置前的行内样式代码演示：
<h1>设置前的行内样式</h1>
c、设置后的行内样式代码掩饰：
<h1 style="color=red;">设置后的行内样式</h1>
a、内嵌式就是把样式写在<head>标签中，并用<style>标签去声明，下面的例子即使用内嵌式。
b、设置前的内联样式代码演示：
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title></head><body><h1>内联样式</h1></body></html>
c、设置后的内联样式代码掩饰：
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title><style>h1{color:red;}</style></head><body><h1>内联样式</h1></body></html>
a、外部样式是指在外部定义 CSS 样式表并形成以.CSS 为扩展名文件，然后在页面中通过<link>链接标记链接到页面中，而且该链接语句必须放在页面的<head>标记区.
b、首先新建一个后缀名为 .css 的文件，里面写入：
h1{color:red;}
html文件中引入该文件，示例如下：
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title><link rel="stylesheet" href="style1.css"></head><body><h1>link引入外部样式</h1></body></html>
天蓬老师