1、id和class:必须以字母开头,可以有数字。在前端开发中,编写css时,一般用class选择器,尽量避免使用id选择器。
id选择器 #id 。 id是一个元素的唯一标识。
class选择器 .class 。class属性用来为一个元素分组,页面中相同的class属性值可以出现多个,并且一个元素可以拥有多个class.
2、标签中还支持一个属性,叫做title.
一个元素设置了title属性以后,当鼠标引入到元素上边时,title中的文字会显示出来。
3、元素之间的关系
(1)祖先元素:直接或间接被祖先元素包含的元素我们称为后代元素(子元素也是后代元素)。
(2)后代元素: 直接或间接包含后代元素的元素我们称为祖先元素(父元素也是祖先元素)。
(3)父元素:直接包含子元素的元素我们称为父元素。
(4)子元素: 直接被父元素包含的元素我们称为子元素。
(5)兄弟元素: 拥有相同的父元素的元素称为兄弟元素。
3、不同关系的选择器
(1)后代元素选择器:
- 作用:选择指定元素的指定后代元素
- 语法:祖先元素 后代元素
- 例子:div p{}
- 这样会选取所有的在div中的p元素
(2)子元素选择器:
- 作用:选择器指定元素的指定子元素
- 语法:父元素 > 子元素
- 例子:div > p{}
- 会选中所有的div的子元素p
(3)兄弟元素选择器:
- 作用:选择指定元素的后一个兄弟元素或者后边所有的兄弟元素
指定元素的后一个兄弟元素
- 语法:前一个 + 后一个
- 例子:div + p{}
- 选中紧挨着div后边的p元素
指定指定元素后边的所有元素
- 语法:前一个 ~ 后一个
- 例子: div ~ p {}
- 选择div后边所有的p兄弟元素