[CSS點滴]標籤巢狀規則
基本巢狀規則
1.body可以直接包含塊狀元素、ins、del、script。不可以直接包含行內元素
2. ins和del(行內元素)可以包含塊狀元素或者行內元素,其他任何行內元素都不允許包含塊狀元素
2. p、h1-h6可以直接包含行內元素和文字資訊,但是不允許包含塊狀元素
3. dl元素只允許包含dt和dd,同時dt不能包含塊狀元素,只允許包含行內元素,對於dd可以包含任何元素
4. form元素不能夠直接包含input元素。原因在於input元素屬於行內元素,form元素僅僅能夠包含塊狀元素
5. table元素只能夠包含caption、colgroup、col、thead、tbody、tfoot,不能夠直接包含tr或者其他任何元素
總結
在開發的時候,我們不僅要了解標籤的語義性,也要知道上面文章內容提到的標籤巢狀規則,這樣才能更好的提高我們的程式碼質量。
相關推薦
[CSS點滴]標籤巢狀規則
基本巢狀規則 1.body可以直接包含塊狀元素、ins、del、script。不可以直接包含行內元素 2. ins和del(行內元素)可以包含塊狀元素或者行內元素,其他任何行內元素
CSS塊級標籤與內聯標籤巢狀規則
塊級標籤與內聯標籤巢狀規則 1) 塊元素可以包含內聯元素或某些塊元素,但內聯元素卻不能包含塊元素 2) 塊級元素不能放在<p>裡面 3) 有幾個特殊的塊級元素只能包含內嵌元素,不能再包含
HTML標籤巢狀必須規範化!!(html與css設定樣式的大坑)
問題描述:在設定下圖的span元素,css樣式並沒有生效,(原本還對自己的 後代選擇器和子代選擇器知識 有點不自信,特意又看了下這兩個選擇的文件,並沒錯。)問了兩個大佬,終於得到了答案就是 html標籤巢狀規範不符合規則(剛開始我也納悶,....直到改了程式碼。確實需要注意這個問題。) 問
常用的標籤分類和巢狀規則
標籤(空格分隔): 標籤巢狀規則 HTML中標籤元素三種不同型別:塊狀元素,行內元素,行內塊狀元素。常用的塊狀元素: <div> <p> <h1>~<h6> <ol> <ul> <table><form>
第15講 struts2標籤巢狀
鏈條方式指,struts.xml中,在一個result結果直接跳轉到另外一個action中,資料可以共享, 1在HeadFirstStruts2chapter02_07中,新建HelloAction2,name2屬性,get() set()方法,在預設的execute()方法中給 name2賦值,p
行內元素和塊狀元素巢狀規則
如果不按照HTML規則書寫程式碼時,瀏覽器就不會正確解析,會將不符合巢狀規則的節點放到目標節點的下面,或者變成純文字。HTML存在許多種型別的標籤,有的標籤下面只允許特定的標籤存在,這就是HTML巢狀規則。 塊狀元素:一般是其他元素的容器,可容納內聯元素和其他塊狀元素,塊狀元素排斥其他元素
【20180517】CheckBox與其他標籤巢狀使用的問題
問題描述: 當我們用到a標籤和input標籤巢狀,點選a標籤的時候,事件冒泡一次,同時會觸發關聯的input的click事件,導致事件再次冒泡,以至於CheckBox達不到我們想要的效果。 <a href="javascript:;" id="SelectType" class="righ
CSS3——元素巢狀規則
元素巢狀規則: 行級元素只能巢狀行級元素,塊級元素可以巢狀任何元素。 Div裡面可以加任何東西,但是span就只能加行級元素, 行級元素巢狀行級元素很正常,行級元素本來空間就小,不可能巢狀塊級元素,但是有個特殊的,p標籤是塊級元素,p標籤裡面套個div是不是無可厚非,就不行,這就是規定,
Less學習筆記7:巢狀規則
巢狀規則 現有一個列表如下: <ul class="list"> <li> <a href="#">這裡是一個進行測試的文字</a>
css分組合巢狀選擇器
1.分組選擇器 在樣式表中有很多具有相同樣式的元素。 如: h1{color:green;}h2{color:green;}p{color:green;} 為了儘量減少程式碼,你可以使用分組選擇器。 每個選擇器用逗號分隔. h1,h2,p{color:green;} 2.
CSS 分組和巢狀 選擇器
Grouping Selectors在樣式表中有很多具有相同樣式的元素。h1{color:green;}h2{color:green;}p{color:green;} 為了儘量減少程式碼,你可以使用
CSS 分組和巢狀
組選擇器 <!DOCTYPE html > <html> <head> <meta charset="utf-8"> <title&g
CSS 分組 和 巢狀 選擇器
在樣式表中有很多具有相同樣式的元素。 h1{color:green;} h2{color:green;} p{color:green;} 分組選擇器:(相同樣式不同元素可使用分組選擇器) h1,h2,p{color:green;} 巢狀選擇器 它可能適用於選擇
web前端-CSS 分組和巢狀-015
Grouping Selectors 在樣式表中有很多具有相同樣式的元素。 h1 { color:green; } h2 { color:green; } p { color:green; } 為了儘量減少程式碼,你可以使用分組選擇器。 每個選擇器用
struts2標籤巢狀問題
<s:iterator value="%{#request.courselist}" id="course"> <a href="getCourseAction?id=${course.courseid}">
學會如何使用LESS(二)----巢狀規則、運算、名稱空間和作用域
巢狀 一、巢狀規則 header{ h1{ font-size: 18px; color: green; } .box1{ width: 300px; height: 200px;
a標籤巢狀a標籤
實現如: 在一個長寬均設定好的範圍內,新增好了超連結,然後裡面有2個文字,僅這2個文字有其它超連結。 css:z-index 其實用到的是z-index. z-index 屬性設定元素的堆疊順序。擁有更高堆疊順序的元素總是會處於堆疊順序較低的元素的前面。 註釋:元素
對錶格和表單的介紹,標籤巢狀原則。
上一篇稍微說了一下HTML和標籤,這一篇進行一次簡單的總結,並且初識css。 一。首先說一下表格標籤即<table></table>標籤 ①. <table>...</table>:整個標籤是以<table>標
ThinkPHP3.2 標籤巢狀
碰到了這個錯誤 1.剛開始還以為是標籤沒有對齊的錯誤,排查了好久,確定標籤方面沒有問題 2.後來才知道是thinkphp的<if> 標籤巢狀時預設是3層,巢狀過多就會報這個錯誤,看網
關於p標籤不能巢狀div標籤引發的標籤巢狀問題總結
問題由來:<p>中巢狀<div>標籤,兩個都是塊級元素,按理應該可以正常顯示,但是最後的結果居然是多出來一段<p>的效果,所以就在網上找了許多關於標籤巢狀規則的資料,下面做一個個人總結。 1.塊級元素(block)與內聯元素(inline)的區別: &nbs