web前端培训课程之选择器

• 选择器（selector），会告诉浏览器：网页上的哪些元素需要设置什么样的样式。

• 比如：p这个选择器就表示选择页面中的所有的p元素，在选择器之后所设置的样式会应用到所有的p元素上。

元素选择器

• 元素选择器（标签选择器），可以根据标签的名字来从页面中选取指定的元素。

• 语法：标签名 { }

• 比如p则会选中页面中的所有p标签，h1会选中页面中的所有h1标签。

类选择器

• 类选择器，可以根据元素的class属性值选取元素。

• 语法：.className { }

• 比如.hello会选中页面所有class属性为 hello的元素。

ID选择器

• ID选择器，可以根据元素的id属性值选取元素。

• 语法：#id { }

• 比如#box会选中页面中id属性值为box的元素，和class属性不同，id属性是不能重复的。

复合选择器

• 复合选择器，可以同时使用多个选择器，这样可以选择同时满足多个选择器的元素。

• 语法： – 选择器1选择器2{}

• 例如div.box1会选中页面中具有box1这个 class的div元素。

群组选择器

• 群组选择器，可以同时使用多个选择器，多个选择器将被同时应用指定的样式。

• 语法：选择器1,选择器2,选择器3 { }

• 比如p,.hello,#box会同时选中页面中p元素， class为hello的元素，id为box的元素。

通用选择器

• 通用选择器，可以同时选中页面中的所有元素。

• 语法： *{ }

热门视频