CSS:层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。
CSS 能够对网页中元素位置的排版进行像素级精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力。
css引入样式
- 内嵌式
- 内联式
- 外联式
内嵌式
在对应的标签内直接添加 style=" " 样式写在引号内
内联式
一般只在平常练习的时候用,真正项目更多的是用外联式。内联式会造成代码耦合,不方便维护
在<head></head>标签中添加<style></style> 样式写在此标签中
外联式
- 创建一个css文件
- 通过 link 引入对应的css文件
css基本语法
- 通过选择器选择到对应的元素
- 写个大括号
- 在大括号内写样式
选择器{
属性:属性值;
}
选择器
- 标签选择器
直接写标签名,即可选择到对应的标签(选择到的范围较广,谨慎使用)
选择器 {
}
- 类选择器
需要给对应的元素设置 class 属性并设置类名,通过 .class 选择到对应的元素
类名采用英文字母、数字以及 " - " 命名,以小写字母开头,不能以数字和 " - " 开头
. 类名 {
}
- id选择器
在网页上同一个id只能出现一次,使用 #id 选择到对应的元素(选择范围较小)
#id {
}
- 群组选择器
如果多个元素样式相同,可以将选择器写在一起,用 , 隔开
选择器1 , 选择器2 , 选择器3 {
}
- 后代选择器
限制选择器的选择范围,可以选择到祖先下的所有后代,包括后代的后代...
祖先 后代 {
}
- 子代选择器
只能选择到父元素下一级的子元素,子元素的下一级元素不会被选中
父选择器 > 子选择器 {
}