CSS选择器常见用法

CSS选择器的主要功能就是选中⻚⾯指定的标签元素.选中了元素,才可以设置元素的属性.

通过以下代码来学习CSS选择器的使用.

    <div class="font32">我是⼀个div, class为font32</div><div class="font32">我是⼀个div, class为font32</div><div><a href="#">我是⼀个div</a></div><ul><li>aaa</li><li>bbb</li><li><a href="#">ccc</a></li></ul><ol><li>1111</li><li>2222</li><li>3333</li></ol><button id="submit">提交</button>

标签选择器

用法: 标签+{属性}.例如:

    <style>div{color: red;}</style>

类选择器

用法: .类名+{属性}.例如:

    <style>.font32{color: blue;}</style>

⼀个类可以被多个标签使⽤,⼀个标签也能使⽤多个类(多个类名要使⽤空格分割,这种做法可以让代码更好复用)

ID选择器

用法: #id+{属性},例如:

    <style>#submit{color: green;}</style>

id是唯⼀的,不能被多个标签使用.

通配符选择器

用法:*+{属性},可以选择整个页面进行编辑.例如:

    <style>* {color: purple;}</style>

复合选择器

用法:标签 标签+{属性},后续标签要是前置标签的后代,例如:

    <style>ol li{color: red;}</style>

只有ol下的li被改为红色,而ui下的li没有被修改.