1. 程式人生 > >使用<span>標簽為文字設置單獨樣式

使用<span>標簽為文字設置單獨樣式

例子 doctype doc 講解 進行 註意 道德 ron 沒有

這一小節講解<span>標簽,我們對<em><strong><span>這三個標簽進行一下總結:

1. <em><strong>標簽是為了強調一段話中的關鍵字時使用,它們的語義是強調。

2. <span>標簽是沒有語義的,它的作用就是為了設置單獨的樣式用的。

如果現在我們想把上一小節的第一段話“美國夢”三個字設置成blue(藍色),但註意不是為了強調“美國夢”,而只是想為它設置和其它文字不同的樣式(並不想讓屏幕閱讀器對“美國夢”這三個字加重音讀出),所以這樣情況下就可以用到<span>標簽了。

如下面例子:

<p>1922年的春天,一個想要成名名叫<em>尼克?卡拉威</em>(托比?馬奎爾Tobey Maguire 飾)的作家,離開了美國中西部,來到了紐約。那是一個道德感漸失,爵士樂流行,走私為王,<strong>股票</strong>飛漲的時代。為了追尋他的<span>美國夢</span>,他搬入紐約附近一海灣居住。</p>

語法:

<span>文本</span>

任務

我來試試:把“美國夢”設置為藍色

1. 在右部編輯器中的第13行對“美國夢”文本加上<span>標簽。

2. 在第8行輸入color:blue;,為<span>元素設置文本顏色為藍色。

代碼:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>了不起的蓋茨比</title>
<style>
span{
color:blue;

}
</style>
</head>
<body>
<p>1922年的春天,一個想要成名名叫尼克?卡拉威(托比?馬奎爾Tobey Maguire 飾)的作家,離開了美國中西部,來到了紐約。那是一個道德感漸失,爵士樂流行,走私為王,股票飛漲的時代。為了追尋他的<span>美國夢</span>,他搬入紐約附近一海灣居住。</p>
<p>菲茨傑拉德,二十世紀美國文學巨擘之一,兼具作家和編劇雙重身份。他以詩人的敏感和戲劇家的想象為"爵士樂時代"吟唱華麗挽歌,其詩人和夢想家的氣質亦為那個奢靡年代的不二註解。</p>
</body>
</html>

使用<span>標簽為文字設置單獨樣式