标签{属性:值;}
在head标签中写。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> /**在这里注释方法就变了*/ div{ font-size:50px; color:green; background-color:yellow; } </style> </head> <body> <div>威武</div> <div>霸气</div> <div>威武霸气</div> <p>小可爱</p> </body> </html>颜色的显示方式：
1，直接写颜色的名称
2，十六进制显示颜色 ， #AABBCC 前2位代表红色，中间2位代表绿色，后两位为蓝色 0~255
3，rgb color:rgb(0,0,0) 黑色
标签选择器一打一大片。而类选择器，指谁打谁。
写法：
.自定义类名{属性:值; 属性:值; }
特点：谁调用谁生效，在标签中 class="自定义类名"
一个标签可以调用多个类选择器。 class="自定义类名1 自定义类名2"
多个标签可以调用同一个选择器。
类选择器命名规则: 同java语言，可以使用汉字，但不建议使用。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> /**在这里注释方法就变了*/ .box{ font-size:50px; color: #ff0000; width: 400px; height: 300px; background-color:#999; } .miss{ text-indent:2em; text-align:left; } </style> </head> <body> <!--特点是谁调用，谁生效--> <div class="box">威武</div> <div>霸气</div> <div>威武霸气</div> <!--调用多个类选择器的语法--> <p class="box miss">小可爱</p> </body> </html> ID选择器写法
#自定义名称{属性:值; 属性:值;}
调用
id="自定义名称"
特点：一个ID选择器在一个页面只能使用一次，如果使用两次，两次以上不符合W3C规范。
一个标签只能调用一个ID选择器。
通配符选择器*{属性:值}
所有的标签，都会使用相同的样式。同时，会耗时，因为将样式应用于所有标签。
增加浏览器和服务器的负担。
两个或者两个以上的基础选择器通过不同的方式连接在一起。
交集选择器标签+类（ID）选择器{属性:值； 属性:值;}
div.box{
}
div#miss{ //也是OK的
}
特点：即要满足使用了某个标签，还要满足使用了类/ID选择器。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> /**在这里注释方法就变了*/ .box{ font-size:50px; width: 400px; height: 300px; background-color:#999; } .miss{ text-indent:2em; text-align:left; } div.box{ color: #ff0000; } </style> </head> <body> <!--特点是谁调用，谁生效--> <div class="box">威武</div> <div>霸气</div> <div>威武霸气</div> <!--调用多个类选择器的语法--> <p class="box miss">小可爱</p> </body> </html>后代选择器
子代选择器
并集选择器
