<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
/*命名方式：单词-单词-数字*/
/*标签选择器*/
span{
font-family: "微软雅黑";
font-size: 50px;
color: white;
}
/*id选择器*/
#t1{
color: red;
}
#t2{
color: green;
}
/*class选择器*/
.l1{
color: blue;
}
/*自定义属性选择器*/
[a=‘b‘]{
color: red;
}
/*并列选择器*/
#t1,#t2{
font-style: italic;
}
/*子代选择器*/
#u1 li{
font-size: 20px;
}
</style>
<link rel="stylesheet" type="text/css" href="css/new_file.css"/>
</head>
<body>
<span style="background-color: red;">
wwqdwd
</span>
<br />
<span>
123456789
</span>
<style>
</style>
<table>
<tr>
<td id="t1">1</td>
<td id="t2">B</td>
</tr>
</table>
<ul id="u1">
<li class="l1">1</li>
<li class="l1">2</li>
<li class="l1">3</li>
<li class="l1">4</li>
</ul>
<ul>
<li a="b">1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
</body>
</html>
wwqdwd
123456789
| 1 | B |
原文：http://www.cnblogs.com/sglq/p/7170355.html