国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 開發(fā) > CSS > 正文

html P標簽為什么不能嵌套div?還有關(guān)于html P標簽的css樣式的實例介紹

2020-03-24 17:06:05
字體:
供稿:網(wǎng)友
首頁 > web前端 > html教程 > 正文 html P標簽為什么不能嵌套div?還有關(guān)于html P標簽的css樣式的實例介紹 2018-08-25 10:49:31 第六期線上培訓班
本篇文章介紹了有關(guān)于html p標簽的進階版,上一篇基礎(chǔ)版沒看過的同學點擊下方的鏈接就可以看了,本篇主要介紹了html p標簽的兩個重要知識點,一個是如何用css的樣式來控制P標簽的具體使用,每個都有實例,有興趣的同學可以自己敲代碼試試,還有一個是html P標簽為什么不能嵌套div的詳解,希望各位認真閱讀

html P標簽標簽定義及使用說明:

p 標簽定義段落。

p 元素會自動在其前后創(chuàng)建一些空白。瀏覽器會自動添加這些空間,您也可以在樣式表中規(guī)定。

html P標簽的屬性:

tuyi.png

HTML中P標簽內(nèi)為什么不能嵌套div標簽

深究:

我們先來認識in-line內(nèi)聯(lián)元素和block-line塊元素,因為HTML里幾乎所有元素都屬于內(nèi)聯(lián)元素或者塊元素中的一種。

in-line這個詞有很多種解釋:內(nèi)嵌、內(nèi)聯(lián)、行內(nèi)、線級等,但是,它們都是表示相同的意思,在這里我們選擇習慣的叫法-內(nèi)聯(lián)。

先看下面的例子你就能明白兩者的差別:

 p 測試一下塊元素與 span 內(nèi)聯(lián)元素 /span 的差別 /p  p 測試一下 div 塊元素 /div 與內(nèi)聯(lián)元素的差別 /p 

上面的例子自己隨便實踐一下就知道效果了,這里就不占用空間了, div 會自己產(chǎn)生一個新的行,而 span 并沒有換行,這是在沒有CSS渲染的情況下才這樣,同樣,我們也可以通過CSS把div定義成內(nèi)聯(lián)元素,把span定義成塊元素,但是,我們卻不能在HTML里任意轉(zhuǎn)化它們,塊元素可以包含內(nèi)聯(lián)元素或某些塊元素(上面的例子其實是錯誤的使用--- 我把 div 放在 p 里面了) ,但內(nèi)聯(lián)元素卻不能包含塊元素,它只能包含其他的內(nèi)聯(lián)元素,再看看這個:

 h2 我喜歡在 a href= http://www.survivalescaperooms.com/ php  /a 討論Web標準的原因。 /h2 

其中 h2 是屬于塊元素,而 a 是屬于內(nèi)聯(lián)元素, h2 包含 a 是沒有錯誤的,同樣, div 可以包含 p , p 包含 a 也是對的,但是如果是下面這樣的話,就是錯誤的,因為內(nèi)聯(lián)元素不應(yīng)該包含塊元素:

 a href= # h2 這樣是錯誤的用法! /h2 /a 

還有一些情況就是一些塊元素不可以包含另一些塊元素。例如這樣:

 p 測試文字 li 現(xiàn)階段是不能這樣用的,要等到XHTML 2.0才可以這樣用。 /li  /ul  測試文字 /p 

而這樣又是可以的。

 ul  li p 這樣是可以的 /p /li  /ul 

為什么呢?因為我們使用的DTD中規(guī)定了塊級元素是不能放在 p 里面的,再加上一些瀏覽器縱容這樣的寫法:

p 這是一個段落的開始

p 這是另一個段落的開始

當一個 p 簽還沒結(jié)束時,遇到下一個塊元素就會把自己結(jié)束掉,其實瀏覽器是把它們處理成這樣:

 p 這是一個段落的開始 /p  p 這是另一個段落的開始 /p 

所以剛才那樣的寫法會變成這樣:

 p 測試文字 /p  li 現(xiàn)階段是不能這樣用的,要等到XHTML 2.0才可以這樣用。 /li  /ul 

測試文字 p /p

這也是跟剛才說第一個例子中 p 里面放 div 不合理是同一個道理。

那哪些塊元素里面不能放哪些塊元素呢?我知道你有這個疑問,也知道我僅僅列一張清單你不好記住它們。我們可以先把所有的塊元素再次劃分成幾個級別的,我們已經(jīng)知道 html 是在最外層, html 下一級里面只會有 head 、 body 、 frameset 、 noframes ,而我們已經(jīng)知道了可視的元素只會出現(xiàn)在 body 里,所以我們把 body 劃在第一個級里面,接著,把不可以自由嵌套的元素劃在第三個級,其他的就歸進第二個級。

所謂的不可自由嵌套的元素就是里面只能放內(nèi)聯(lián)元素的,它們包括有:標題標記的 h1 、 h2 、 h3 、 h4 、 h5 、 h6 、 caption ;段落標記的 p ;分隔線 hr 和一個特別的元素 dt (它只存在于列表元素 dl 的子一級)。

兼容注釋

在 HTML 4.01 中,不贊成使用 p 元素的 align 屬性;在 XHTML 1.0 Strict DTD 中,不支持 p 元素的 align 屬性。

請使用 CSS 代替。

CSS 語法:

 p >

html P標簽的css樣式的實例:

1.“ text-left ”、“ text-right ”、“ text-center ”屬性控制 p 標簽內(nèi)容位置

 p >

2.“ text-lowercase ”、“ text-uppercase ”、“ text-capitalize ”屬性控制 p 標簽英文內(nèi)容的大小寫

 p >

3.字體:“text-muted ”、“text-info ”、“text-success ”、“text-warning ”、“text-primary ”、“text-danger ”等屬性,對不同情況下的內(nèi)容進行不同顏色的標注

 p >

4.背景:“bg-muted ”、“bg-info ”、“bg-success ”、“bg-warning ”、“bg-primary ”、“bg-danger ”等屬性,對不同情況下的內(nèi)容進行不同顏色背景的標注

 p >

點擊這里查看p標簽的基礎(chǔ)學習文章:html p 標簽是什么元素?關(guān)于html p標簽的定義和作用詳解

【小編的相關(guān)推薦】

html dir標簽是干啥的? dir 標簽的具體定義和屬性介紹

html noscript標簽是什么意思?關(guān)于noscript標簽的用法你了解多少?

以上就是html P標簽為什么不能嵌套div?還有關(guān)于html P標簽的css樣式的實例介紹的詳細內(nèi)容,html教程

鄭重聲明:本文版權(quán)歸原作者所有,轉(zhuǎn)載文章僅為傳播更多信息之目的,如作者信息標記有誤,請第一時間聯(lián)系我們修改或刪除,多謝。

發(fā)表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發(fā)表
主站蜘蛛池模板: 廊坊市| 开封市| 麻江县| 厦门市| 涞源县| 葫芦岛市| 松潘县| 临夏市| 富锦市| 卓尼县| 仁布县| 台州市| 阿尔山市| 务川| 依兰县| 永春县| 临泽县| 香港 | 新巴尔虎右旗| 固原市| 新河县| 武穴市| 荔浦县| 阿克| 东阿县| 桐庐县| 论坛| 根河市| 南宁市| 沙洋县| 通榆县| 东方市| 长宁县| 沙雅县| 河西区| 离岛区| 衢州市| 迁安市| 临邑县| 阿图什市| 肇庆市|