一个页面弄懂 CSS 样式选择器
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> <style> <!-- 某一类标签的样式 --> div {background-color:#b0c4de;} p { font-size:24px; text-align:left; color:red;} <!-- 根据标签中的 class 属性来设置标签的样式 --> .master {font-size:18px;color:red; text-align:center;} .item { border-style:red;} <!-- 根据某一类标签的 class 属性来设置标签元素样式 --> p.item { color:black; font-size:14px;} div.item { text-align:center;font-size:18; color:blue;width:100px;} <!-- id选择器样式 --> #dvi { color:black;font-size:24px; width:200px;margin:0 auto;} #title { font-size:28px;text-align:center; } </style> </head> <body> <div class="master"> <div id="title"> welcome to java web! </div> <p class="item">css style test h2</p> <div class="item">css style test h2</div> <div id="dvi">css style test div </div> </div> </body> </html>