CSS
Cascading Style Sheets
层叠样式表。
用于控制
HTML
中标签样式的语言。可以精确到像素,美化修饰
HTML
标签。
CSS语法
样式名:样式值;
color:red;
font-size:20px;
选择器
用于选择页面中元素
(
标签
)
的工具。
id选择器
1.
给标签添加
id
属性,对其命名
2.
在
style
标签中通过
#id
名获取通常用于选择某一个元素
<html><head><style>#test {}</style></head><body><div id = "test" ></div></body></html>
class选择器
1.
给标签添加
class
属性,对其命名
2.
在
style
标签中通过
.class
名获取
通常用于选择
一组元素
<html><head><style>.test {}</style></head><body><div class = "test" ></div><div class = "test" ></div><div class = "test" ></div></body></html>
元素/html/标签选择器
直接通过标签名获取。
通常用于选择一组元素。
<html><head><style>div {}</style></head><body><div></div><div></div><div></div></body></html>
层次选择器
通过空格或
>
获取某个元素的子元素。
"
元素
A
元素
B"
表示获取元素
A
下的所有元素
B
""
元素
A >
元素
B"
表示获取元素
A
下的第一层元素
B
<html><head><style>#father div {获取其中的所有子元素}#father > div {获取其中的第一层子元素}</style></head><body><div id = "father" ><div><div> 使用 > 无法获取该 div </div></div><div></div></div></body></html>
群组选择器
通过
,
同时选择多个元素
<html><head><style>div , #mp , .mu {}</style></head><body><div ></div><p id = "mp" ></p><ul class = "mu" ><li></li></ul></body></html>
将CSS写在哪里
1.写在标签的style属性中
style="
样式
:
值
;
样式
:
值
;"
2.写在<style>标签中,通过选择器获取标签后控制样式
style
标签通常放在
head
标签中
<html><head><style>选择器 {样式 : 值 ;样式 : 值 ;}/* 获取页面中所有名为 div 的元素 */ 样式名</