CSS样式

来源：互联网发布：网易音乐经典评论知乎编辑：程序博客网时间：2024/06/05 12:46

CSS样式有三种：

1.内部样式表

内嵌式是将CSS代码集中写在HTML（5）文档的head头部标签，并且用style标签定义，（一般放在title后面）。

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title><style>p {color: skyblue;}</style></head><body><p>样式表</p></body></html>

2.行内样式表

style在body的标签内。

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title></head><body><p style="color: skyblue;">样式表</p></body></html>

3.外部样式表

HTML和CSS写在两个文件里，其中CSS要用.css后缀。并用link进行连接。

HTML文件

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title><link rel="stylesheet" type="text/css" href="zj2.css"/><!-- stylesheet 代表是style样式 href是CSS文件路径 --></head><body><p>样式表</p></body></html>

CSS文件：

p {color: skyblue;}

4.三者区别

行内样式表优点，书写方便、权重高；缺点，没有实现样式和结构的分离

内部样式表优点，部分分离；缺点，没有完全分离

外部样式表优点，实现完全分离；缺点，需要引入（推荐使用）

5.结果展示

阅读全文

0 0