幫我看下大改特改的代碼，主要是關于class和id
我設置了四個段落，1,2,3,4，又用了class和id，運行出來的段落顏色只有第一段綠色，其他三個段落都是藍色,歸納總結下，謝謝啦
還有一個問題就是 4個span我都給了顏色，第四個沒有變，這里面有什么關系嗎，是我還沒學到，還是哪章節理解錯了呢
讓老夫瞅瞅
2016-12-31
3 回答
舉報
0/150
提交
取消
2016-12-31
你的代碼基本上都是對的，但是有一點點瑕疵。第一段，因為你用了類first，字體變成綠色，但是span沒有繼承類first，而是使用它自己的屬性，所以span是紅色；第二段，因為你同時存在類second和ID 的second，所以，ID的second覆蓋了second，使其失效，相當于這段代碼是沒寫一樣，不然的話你的第二段文字應該是粉色，但是被覆蓋之后，而ID的second又沒有定義P，所以還是段落依照本來的P執行藍色，而span這是根據ID的second執行綠色；第三段的span是有ID的three，所以是黃色，p則是依照p定義執行藍色；第四段因為你的ID寫成了CLASS，所以沒有體現ID的效果，改過來之后，span變成黑色，而p則是依舊執行藍色。
<!DOCTYPE?HTML> <html> <head> <meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8"> <title>分組選擇符</title> <style?type="text/css"> h1,span{color:red;} .first,#second?span{color:green;} #third?span{color:yellow;} p{color:blue;} .second{color:pink;} #fourth>span{color:black;} </style> </head> <body> ????<h1>勇氣</h1> ????<p?class="first">三年級時，我還是一個<span>膽小如鼠</span>的小女孩，上課從來不敢回答老師提出的問題，生怕回答錯了老師會批評我。就一直沒有這個勇氣來回答老師提出的問題。學校舉辦的活動我也沒勇氣參加。</p> ????<p?id="second">到了三年級下學期時，我們班上了一節公開課，老師提出了一個很<span>簡單</span>的問題，班里很多同學都舉手了，甚至成績比我差很多的，也舉手了，</p> ????<p?id="third">還說著："<span>我來，我來。</span>"我環顧了四周，</p> ????<p?id="fourth">就我<span>沒有</span>舉手。</p> ????<img?src="http://img1.sycdn.imooc.com//52b4113500018cf102000200.jpg"?> </body> </html>2016-12-31
<!DOCTYPE HTML>
<html>
<head>
<!--
作者：[email protected]
時間：2016-12-31
描述：沒太明白您要表達的意思,我理解著你估計是要:把"勇氣"變紅色,段落內是綠色,四個span分別是不同顏色嗎?
-->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>分組選擇符</title>
<style type="text/css">
h1{color:red;}
p{color:green;}
.first span{color:blue;}
#third span{color:yellow;}
#second span{color:pink;}
#fourth span{color:black;}
</style>
</head>
<body>
? ? <h1>勇氣</h1>
? ? <p class="first">三年級時，我還是一個<span>膽小如鼠</span>的小女孩，上課從來不敢回答老師提出的問題，生怕回答錯了老師會批評我。就一直沒有這個勇氣來回答老師提出的問題。學校舉辦的活動我也沒勇氣參加。</p>
? ? <p id="second">到了三年級下學期時，我們班上了一節公開課，老師提出了一個很<span>簡單</span>的問題，班里很多同學都舉手了，甚至成績比我差很多的，也舉手了，</p>
? ? <p id="third">還說著："<span>我來，我來。</span>"我環顧了四周，</p>
? ? <p id="fourth">就我<span>沒有</span>舉手。</p>
? ? <img src="http://img1.sycdn.imooc.com//52b4113500018cf102000200.jpg" >
</body>
</html>
2016-12-31
<p class="fourth">就我<span>沒有</span>舉手。</p>把class改為id
#號用id????? .號用class