2019年11月1日 星期五 1.类别选择器：
<!DOCTYPE html> <html> <head> <title>类别选择器</title> <style type="text/css"> p{ font-size: 12px; } .one{font-size: 18px;} .two{font-size: 24px;} </style> </head> <body> <p class="one">类别1</p> <p class="one">类别1</p> <p class="two">类别2</p> <p class="two">类别2</p> <p>普通段落文字</p> </body> </html>页面显示： 2.相对应的样式设置
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>mytitle</title> <style type="text/css"> body{ background-color: #ccc; text-align: center; font-size: 12px; } h1{ font:"黑体"; font-size: 20px; } p{ color:red; font-size: 16px } hr{ width: 200px; } </style> </head> <body> <h1>标题</h1> <hr> <p>正文</p> 版权 </body> </html>页面显示： 总结：上面两个都是利用的内嵌样式，可以另将css代码新建在css样式页面，就可以调用统一的样式，方便后期维护代码，减少工作量。 外部样式链接代码如下：
<link rel="stylesheet" href="style.css">3.id选择器
<!DOCTYPE html> <html> <head> <title>id选择器</title> <style type="text/css"> #one{font-size: 12px;} #two{font-size: 24px;} </style> </head> <body> <p id="one">文字1</p> <p id="two">文字2</p> </body> </html>页面显示： id选择器与类别选择器的区别： id样式定义的样式只能在页面要被唯一引用一次，类别选择器定义的样式可以多次被引用，作用于多个网页元素上面。
