复习。
一:类选择器
1.多类名选择器
使用场景:某个标签上需要多个类进行描述。
多个类之间使用空格分开。
冲突的时候,和类名在html中的先后顺序没有关系,和css中的样式的先后顺序有关系。
2.案例
需求:将几个div标为红色,然后将第一个div还要字体变大为40.
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style> 7 .red{ 8 color: red; 9 } 10 .font20{ 11 font-size: 40px; 12 } 13 </style> 14 </head> 15 <body> 16 <div class="red font20">多类名</div> 17 <div>多类名</div> 18 <div>多类名</div> 19 <div class="red">多类名</div> 20 <div>多类名</div> 21 <div class="red">多类名</div> 22 <div>多类名</div> 23 </body> 24 </html>
3.效果
二:id选择器
1.说明
使用#
三:通配符选择器
1.通配符选择器
* :所有
?:一个的意思
2.案例
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style> 7 * { 8 color: red; 9 } 10 11 </style> 12 </head> 13 <body> 14 <div class="red font20">多类名</div> 15 <p>多类名</p> 16 <span>多类名</pan> 17 </body> 18 </html>
3.效果
四:标签选择器
1.说明
标签后面加选择器
原文:https://www.cnblogs.com/juncaoit/p/10822921.html