id可以换为class,class对应的名字可以多个一样
<div class="box">box1</div>
<div class="box">box2</div>
<div class="box">box3</div>
改变样式的时候
。box{}就改为一致的效果
<div class="box">box1</div>
<p class="box">box2 /p>
<div class="box">box3</div>
改变样式的时候也可以是:
div{}
p{}分别改变div的样式和p的样式。
当有包含的关系的时候如下
1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>无标题文档</title> 6 <style> 7 #box p{width:100px;height:100px;background:red;} 8 p{width:100px;background:blue;} 9 /* 10 包含选择器 11 box下面的p标签 12 */ 13 </style> 14 </head> 15 <body> 16 <div id="box"> 17 <p>p1</p> 18 </div> 19 <p>p2</p> 20 </body> 21 </html>
#box p{}表示box下面的p标签改变样式。注意注意注意:box要空格