<ins id="zjdlt"><span id="zjdlt"></span></ins>

      <span id="zjdlt"><nobr id="zjdlt"></nobr></span>

        您當前的位置:首頁 > 建站常識 > div基礎

        HTML中為何P標簽內不可包含DIV標簽?

        2016-06-14
          一句話:有些塊元素不可以包含另一些塊元素,DTD中規定了塊級元素是不能放在P里的。
          P標簽內包含塊元素時,它會先結束自己,比如:
          <p>
            <div>
              測試p包含div
            </div>
          </p>
          那么瀏覽器會解釋成:
          <p></p>
          <div>測試p包含div</div>
          <p></p>
          會多解釋出一個p
          起因:在做項目時發現原本在DW中無誤的代碼到了MyEclipse6.0里面卻提示N多錯誤,甚是詫異。于是究其原因,發現塊級元素P內是不能嵌套DIV的。
          深究:我們先來認識in-line內聯元素和block-line塊元素,因為HTML里幾乎所有元素都屬于內聯元素或者塊元素中的一種。
          in-line這個詞有很多種解釋:內嵌、內聯、行內、線級等,但是,它們都是表示相同的意思,在這里我們選擇習慣的叫法--內聯。
          先看下面的例子你就能明白兩者的差別:
          <p>測試一下塊元素span與<span>內聯元素</span>的差別</p>
          <p>測試一下<div>塊元素div</div>與內聯元素的差別</p>
          效果如下圖:
          在上面的例子中,<div>會自己產生一個新的行,而<span>并沒有換行,這是在沒有CSS渲染的情況下才這樣,同樣,我們也可以通過CSS把div定義成內聯元素,把span定義成塊元素,但是,我們卻不能在HTML里任意轉化它們,塊元素可以包含內聯元素或某些塊元素(上面的例子其實是錯誤的使用--->我把<div>放在<p>里面了) ,但內聯元素卻不能包含塊元素,它只能包含其他的內聯元素,再看看這個:
          <h2>HMLT中為何<a href="http://www.wangjiehua.com/ " >P標簽不可以</a>包含div標簽呢?</h2>
          其中<h2>是屬于塊元素,而<a>是屬于內聯元素,<h2>包含<a>是沒有錯誤的,同樣,<div>可以包含<p>,<p>包含<a>也是對的,但是如果是下面這樣的話,就是錯誤的,因為內聯元素不應該包含塊元素:
          <a href="#"><h2>這樣是錯誤的用法!</h2></a>
          還有一些情況就是一些塊元素不可以包含另一些塊元素。例如這樣:
          <p>
           測試文字
            <ul>
              <li>現階段是不能這樣用的,要等到XHTML 2.0才可以這樣用。</li>
            </ul>
           測試文字
          </p>
          而這樣又是可以的。
          <ul>
            <li><p>這樣是可以的</p></li>
          </ul>
          為什么呢?因為我們使用的DTD中規定了塊級元素是不能放在<p>里面的,再加上一些瀏覽器縱容這樣的寫法:
          <p>這是一個段落的開始
          <p>這是另一個段落的開始
          當一個<p>簽還沒結束時,遇到下一個塊元素就會把自己結束掉,其實瀏覽器是把它們處理成這樣:
          <p>這是一個段落的開始</p>
          <p>這是另一個段落的開始</p>
          所以剛才那樣的寫法會變成這樣:
          <p>測試文字</p>
          <ul>
            <li>現階段是不能這樣用的,要等到XHTML 2.0才可以這樣用。</li>
          </ul>
          測試文字<p></p>
          這也是跟剛才說第一個例子中<p>里面放<div>不合理是同一個道理。
          那哪些塊元素里面不能放哪些塊元素呢?我知道你有這個疑問,也知道我僅僅列一張清單你不好記住它們。我們可以先把所有的塊元素再次劃分成幾個級別的,我們已經知道<html>是在最外層,<html>下一級里面只會有<head>、<body>、<frameset>、<noframes>,而我們已經知道了可視的元素只會出現在<body>里,所以我們把<body>劃在第一個級里面,接著,把不可以自由嵌套的元素劃在第三個級,其他的就歸進第二個級。所謂的不可自由嵌套的元素就是里面只能放內聯元素的,它們包括有:標題標記的<h1>、<h2>、<h3>、<h4>、<h5>、<h6>、<caption>;段落標記的<p>;分隔線<hr>和一個特別的元素<dt>(它只存在于列表元素<dl>的子一級)。
          為什么說第二級的元素可以自由嵌套呢?我們可以把它們看成是一些容器(或者說是盒子),這些容器的大小可以自由變化,例如我們可以把<ul>嵌在<div>里面,也可以把<div>嵌在<li>里面。
          在HTML里有幾個元素是比較特別的:<ul>、<ol>、<dl>、<table>,它們的子一層必須是指定元素,<ul>、<ol>的子一級必須是<li>;<dl>的子一級必須是<dt>或者<dd>;<table>的子一層必須是<caption> 或<thead>、<tfoot>、<tbody>等,而再子一層必須是<tr> (<tr>只存在于<thead>、<tfoot>、<tbody>中),之后才是可放內容的<td>或者<th>。
          很多人在W3C校驗無法通過也是這個原因-->錯誤的元素嵌套,然而把提示錯誤的標簽改成<div>或者<span>就可以通過,但是我們不能這樣盲目的為了校驗而校驗,<div>也不是神,<div>代替不了語義化的標簽。
          下面有一張關于(X)HTML Strict下嵌套規則的圖,可以參考:
          其實在內聯元素中,還是可以再區分一下的,有幾個元素(<img>、<input>等)比較特別,它們可以定義寬高。雖然在IE瀏覽器里,所有的元素都可以定義寬高,但這是IE自己的標準,并非所有瀏覽器都支持,W3C稱它們為replaced元素,我也找不到適合翻譯的詞,它們在屬于in-line的情況下同樣具有block-line的一些特性,在"display:inline-block的應用"中所說的inline-block其實就是讓其他元素也模擬成replaced元素,你暫時也不用過多了解,等到后面再學習它。

         knl七七世界-網站建設|UI設計|人資系統|二次開發

        本文關鍵詞:包含DIV標簽  P標簽  

        一切精彩源自七七網絡!我們傾力打造時尚潮流第一線!

        ? 2012-2024七七世界網站建設     20707.net 1125w.com 版權所有     豫ICP備14018694號-1

        欧美特黄特级一级,日日摸夜夜摸狠狠摸97,欧洲vodafonewifi巨大动漫
        <ins id="zjdlt"><span id="zjdlt"></span></ins>

            <span id="zjdlt"><nobr id="zjdlt"></nobr></span>