HTML代碼如下：
<!DOCTYPE html>
<html>
<head>
<title>我的HTML代碼</title>
<style type="text/css">
p{
background-color: pink
}
</style>
</head>
<body>
<div class="box">
<div>首行元素</div>
<p class="line1">1. 數學成績：100分</p>
<p class="line1">2. 語文成績：200分</p>
<p id="line3">3. 英語成績：150分</p>
</div>
<p>4. 科學成績：99分</p>
<form>
<input type="text" name="uesrname">
<input type="text" name="password">
</form>
</body>
</html>1.根據標籤的名字選擇，示例代碼如下：
<style type="text/css">
p{
background-color: pink
}
</style>2.根據類名選擇，要在類名前面加一個點“.”，實例代碼如下：
<style type="text/css">
.line1{
background-color: pink
}
</style>3.根據id選擇，要在id前面加一個“#”號，實例代碼如下：
<style type="text/css">
#line3{
background-color: pink
}
</style>4.查找子孫元素，那麼要在子孫元素中間有一個空格，那麼實例代碼如下：
<style type="text/css">
#box p{
background-color: pink
}
</style>5.直接查找子元素，那麼要在父元素中間有一個>，實例代碼如下：
<style type="text/css">
#box > p{
background-color: pink
}
</style>6.根據屬性的名字進行查找，那麼應該先寫標籤名字，然後再中間中括號寫屬性的值，實例代碼如下：
<style type="text/css">
input[name="username"]{
background-color: pink
}
</style>7.在根據類型或者id進行查找到的時候，如果還要標籤名進行過濾，那麼可以在類或者id前面加上標籤名字，實例代碼如下：
<style type="text/css">
div.line1{
background-color: pink
}
</style>
