1. 命名
命名规范
按照 W3C 规范命名有以下几种原则(包括类名,文件或文件夹名等所能遇到的所有命明)
- 命名中 只能存在 字母 数组 下划线
- 命名中 只能存在 字母 数字 下划线
- 命名必须遵守语义化(好理解,容易记)
- 不要用拼音及拼音缩写,尽量使用单词
两种格式
a. 驼峰命名
例如 商品列表:=>goods 列表=>list
=>goodsList(小驼峰)推荐
=>GoodsList(大驼峰)
b.地中海命名(匈牙利命名)
例如: 商品列表 => goods_list
2. 选择器
类选择器(class 选择器)
当同种标签过多时 我们可以使用 标签中 class 属性 给标签起个名字(类名)
然后在 css 中使用 .类名 的方式 选择具体的标签 并编写样式
一个标签可以有多个类名 每个类名 以空格隔开类名 可以重复使用
标签选择器
直接在 style 中 使用标签名的方式来选择具体标签
<style>
div{
样式名 : 值
}
</style>
ID 选择器
- 需要在标签内 使用 id 这个属性 来设置 id 名
然后在 style 标签中使用 #id名 的形式 选择具体属性
<style>
first{
}
</style>
- 注意!!!!!
id 具有唯一性 整个页面中 id 不能重复!!!!!
通常情况下 一个标签 只能有 一个 id - 不建议使用 id 来写 css
- 区分理解 class 和 id
人名 相当于 class 因为人名可以重复
身份证号 相当于 id 因为不可以重复
群组选择器
可以配合着 class 标签 id 等选择器一起使用多个选择器之间以逗号隔开
例如:选择器1,选择器2,选择器3{
组合选择器
详细的描述一个标签的属性或标签名
有几个 class 就写几个 class 写的越详细 优先级越高
注意!!!中间不能有空格
后代选择器
父选择器与子孙选择器之间以空隔开
例如: .f1 .f2 .f3{
}
子选择器 :
父选择器与子选择器之间以 > 隔开
注意!! 只能选择 直属子元素 不能选择 后代元素
.f1>.f2{
}
