校园春色亚洲色图_亚洲视频分类_中文字幕精品一区二区精品_麻豆一区区三区四区产品精品蜜桃

主頁 > 知識庫 > HTML標簽嵌套規(guī)則詳細歸納適合新手朋友

HTML標簽嵌套規(guī)則詳細歸納適合新手朋友

熱門標簽:經(jīng)綸電銷機器人 騰訊植物園地圖標注 外呼智能系統(tǒng)報價 巫山縣地圖標注app 鄒城智能外呼系統(tǒng) 華為收費站地圖標注 電話機器人宣傳片 浦東新區(qū)百度地圖標注圖片 個貸電銷機器人
最近在重新學習HTML的知識,算是對HTML的一個重新認識吧!別小看了這東西,一切的網(wǎng)頁可都是以它為基礎的!下面就詳細歸納一下HTML標簽的嵌套規(guī)則吧,希望對大家有所幫助。

XHTML的標簽有許多:div、ul、li、dl、dt、dd、h1~h6、p、a、addressa、span、 strong……我們在運用這些標簽搭建頁面結構的時候,是可以將它們無限嵌套的,但是,嵌套也需要有一定規(guī)則,不能任由自己的個人習慣胡亂嵌套—— XHTML 必竟不是 XML。

在 XHTML 的語言里,我們都知道:ul 標簽包含著 li、dl 標簽包含著 dt 和 dd——這些固定標簽的嵌套規(guī)則十分明確。但是,還有許多標簽是獨立的,它們沒有被捆綁在一起,比如 h1、div、p……那么這些標簽的嵌套規(guī)則到底是怎樣的?今天就來說說這個話題。

提到 XHTML 標簽的嵌套規(guī)則,我們先得知道有這么二類 XHTML 標簽:
一類叫做 塊級元素(block)
一類叫做 內嵌元素(inline,也有許多人叫它:內聯(lián)、行內、線級等)

塊級元素 和 內嵌元素 的劃分標準很簡單,請把下面二行代碼放進 body 標簽里: 

復制代碼
代碼如下:

<div style=”border: 1px solid red;”>div1</div>
<div style=”border: 1px solid red;”>div2</div>


瀏覽器的呈現(xiàn)效果:
div1
div2

頁面呈現(xiàn)的這二個 div 占據(jù)了二行空間,除非讓它們浮動(float)或是進行其他設置,否則誰都不挨著誰,它們都很霸道的占領屬于自己的那一行空間——但凡看到某個標簽有此現(xiàn)象,你就可以叫它:塊級元素(block);

再把下面二行代碼也放進 body 標簽里: 

復制代碼
代碼如下:

<span style=”border: 1px solid red;”>span1</span>
<span style=”border: 1px solid red;”>span2</span>


瀏覽器的呈現(xiàn)效果:
span1 span2

這一次,兩個 span 并列在一行,它們之間睦鄰友好、親切和諧……像這樣的標簽行為,我們可以稱它們?yōu)椋簝惹对兀╥nline);

塊級元素和內嵌元素的區(qū)別:

·塊級元素 一般用來搭建網(wǎng)站架構、布局、承載內容……像這些大體力活都屬于塊級元素的,它包括以下這些標簽:

address、blockquote、center、dir、div、dl、dt、dd、fieldset、form、h1~h6、hr、isindex、menu、noframes、noscript、ol、p、pre、table、ul

· 內嵌元素 一般用在網(wǎng)站內容之中的某些細節(jié)或部位,用以“強調、區(qū)分樣式、上標、下標、錨點”等等,下面這些標簽都屬于內嵌元素:

a、abbr、acronym、b、bdo、big、br、cite、code、dfn、em、font、i、img、input、kbd、label、q、s、samp、select、small、span、strike、strong、sub、sup、textarea、tt、u、var


· 塊元素 和 內嵌元素 是可以互相轉換的,轉換的代碼如下:
display: block; /* 轉成塊元素 */
display: inline; /* 轉成內嵌元素 */

· 塊元素 和 內嵌元素 對于 CSS 的調用規(guī)則是不一樣的(這篇文章討論的是標簽嵌套,所以對這個知識點不展開說明)。

簡單認識了塊元素和內嵌元素以后,下面就可以羅列 XHTML 標簽的嵌套規(guī)則了:

1. 塊元素可以包含內聯(lián)元素或某些塊元素,但內聯(lián)元素卻不能包含塊元素,它只能包含其它的內聯(lián)元素:
<div><h1></h1><p></p></div> —— 對
<a href=”#”><span></span></a> —— 對
<span><div></div></span> —— 錯

2. 塊級元素不能放在<p>里面:
<p><ol><li></li></ol></p> —— 錯
<p><div></div></p> —— 錯

3. 有幾個特殊的塊級元素只能包含內嵌元素,不能再包含塊級元素,這幾個特殊的標簽是:
h1、h2、h3、h4、h5、h6、p、dt

4. li 內可以包含 div 標簽 —— 這一條其實不必單獨列出來的,但是網(wǎng)上許多人對此有些疑惑,就在這里略加說明:

li 和 div 標簽都是裝載內容的容器,地位平等,沒有級別之分(例如:h1、h2 這樣森嚴的等級制度^_^),要知道,li 標簽連它的父級 ul 或者是 ol 都可以容納的,為什么有人會覺得 li 偏偏容納不下一個 div 呢?別把 li 看得那么小氣嘛,別看 li 長得挺瘦小,其實 li 的胸襟很大滴……

5. 塊級元素與塊級元素并列、內嵌元素與內嵌元素并列:
<div><h2></h2><p></p></div> —— 對
<div><a href=”#”></a><span></span></div> —— 對
<div><h2></h2><span></span></div> —— 錯

標簽:那曲 滁州 三沙 廣西 楊凌 南平 日喀則 唐山

巨人網(wǎng)絡通訊聲明:本文標題《HTML標簽嵌套規(guī)則詳細歸納適合新手朋友》,本文關鍵詞  HTML,標簽,嵌套,規(guī)則,詳細,;如發(fā)現(xiàn)本文內容存在版權問題,煩請?zhí)峁┫嚓P信息告之我們,我們將及時溝通與處理。本站內容系統(tǒng)采集于網(wǎng)絡,涉及言論、版權與本站無關。
  • 相關文章
  • 下面列出與本文章《HTML標簽嵌套規(guī)則詳細歸納適合新手朋友》相關的同類信息!
  • 本頁收集關于HTML標簽嵌套規(guī)則詳細歸納適合新手朋友的相關信息資訊供網(wǎng)民參考!
  • 推薦文章
    主站蜘蛛池模板: 利辛县| 江山市| 侯马市| 治县。| 泰宁县| 长顺县| 大庆市| 永清县| 定结县| 抚顺市| 千阳县| 正镶白旗| 三门县| 娄底市| 高淳县| 日照市| 常熟市| 甘肃省| 蛟河市| 嘉黎县| 体育| 保德县| 辽阳市| 辛集市| 六枝特区| 祁连县| 连平县| 兴山县| 伽师县| 乌拉特前旗| 河西区| 彰武县| 汉源县| 池州市| 普兰县| 陕西省| 谢通门县| 儋州市| 周口市| 观塘区| 伊川县|