振宇網頁設計公司
關於振宇 網站設計作品 網站排名 線上洽詢
網頁HTML教程:介紹span和div標籤的使用
2010/01/19
網頁HTML教程:介紹span和div標籤的使用

鑒於HTML初級教程的目的只是教授HTML的骨架元素,這個中級教程增加一些骨肉,它們不應該特別的難,但可以進一步增進我們對HTML的理解,使我們能多做一些更有用的事情。

HTML只是賦予內容的手段,大部分HTML標籤都有其意義(標籤p創建段落,h1標籤創建標題等等)的,然而span和div標籤似乎沒有任何內容上的意義,聽起來就像一個泡沫做成的錘子一樣無用。但實際上,與CSS結合起來後,它們被用得十分廣泛。

它們被用來組合一大塊的HTML代碼並賦予一定的資訊,大部分用類屬性class和識別屬性id與元素聯繫起來,見CSS中級指南的類和id選擇符。

span和div的不同之處在於span是內聯的,用在一小塊的內聯HTML中,而div(想想division是什麼意思)元素是塊級的(簡單地說,它等同於其前後有斷行),用於組合一大塊的代碼。

<div id="scissors">
<p>This is <span class="paper">crazy</span></p>
</div> 

在實踐中,div,特別是span不應該濫用,儘管有其他相左的意見。比如,你要強調單詞“crazy”和加粗類“paper”,可能會用這樣的代碼: 

<div id="scissors">
<p>This is <strong class="paper">crazy</strong></p>
</div>

這是做法比再加一個span比較好。

 

相關文章
更多網頁設計教學

網站設計 FAQ

網站架構圖及設計流程

More...

網頁設計包括哪些費用?

More...

網站建置需要多少時間?

More...
預算有限,想先體驗網路行銷的效果嗎?
More...
如何讓商機源源不絕而來?
More...
我需不需要自行架設主機呢?
More...
什麼是網域名稱(網址)?什麼是虛擬主機(網站空間)?
More...

RUS Website Design 瑞宇.台中網頁設計公司  Copyright © 2004 振宇網頁設計 All rights Reserved.  線上詢價
振宇首頁關於振宇設計作品線上洽詢常見問題新聞時事網頁設計教學友站連結網站地圖  免費交換連結
回到首頁 聯絡振宇