HTML基礎教學之<sp...LOGIN

HTML基礎教學之<span>標籤

這一小節解說<span>標籤,我們對<em>、<strong>、<span>這三個標籤總結:

  • # < ;em>和<strong>標籤是為了強調一段話中的關鍵字時使用,它們的語義是強調。

  •  <span>標籤是沒有語意的,它的功能就是為了設定單獨的樣式用的。

如果現在我們想把上一段詩中的朝代和作者設定成red(red紅色),但注意不是為了強調這個,而只是想為它設定和其它文字不同的樣式(不想讓螢幕閱讀器對朝代和加重音讀出),所以這樣情況下就可以用到<span>標籤了。

如下面例子:

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    </head>
<style>
span{
 color:red;   
}
</style>
    <body>
       <h1>水调歌头·丙辰中秋</h1>
<pre>
<span>朝代:宋代
作者:苏轼</span>
<strong>丙辰中秋,欢饮达旦,大醉,作此篇,兼怀子由。</strong>

明月几时有,把酒问青天。不知天上宫阙,今夕是何年。我欲乘风归去,又恐琼楼玉宇,高处不胜寒。起舞弄清影,何似在人间?
<em>转朱阁,低绮户,照无眠。不应有恨,何事长向别时圆?人有悲欢离合,月有阴晴圆缺,此事古难全。但愿人长久,千里共婵娟。</em>
<pre>
    </body>
</html>

註:本節用到了CSS的知識,大家先作了解,等之後我們學習了CSS之後,就會理解了

下一節
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> </head> <style> span{ color:red; } </style> <body> <h1>水调歌头·丙辰中秋</h1> <pre> <span>朝代:宋代 作者:苏轼</span> <strong>丙辰中秋,欢饮达旦,大醉,作此篇,兼怀子由。</strong> 明月几时有,把酒问青天。不知天上宫阙,今夕是何年。我欲乘风归去,又恐琼楼玉宇,高处不胜寒。起舞弄清影,何似在人间? <em>转朱阁,低绮户,照无眠。不应有恨,何事长向别时圆?人有悲欢离合,月有阴晴圆缺,此事古难全。但愿人长久,千里共婵娟。</em> <pre> </body> </html>
章節課件