html布局規範

2022-08-03 00:51:12 字數 1017 閱讀 4602

像這樣的行內標記,定義它的margin-top和margin-bottom是無效的,除非你把它設定為塊狀元素才可以。display:block

對於塊狀元素,你可以自由的使用外邊距來定義版式和元素之間的距離。類似 div 等等,

無論什麼元素,一旦設定為是浮動顯示,就擁有了完整的盒模型結構,我們就可以使用外邊距,內邊距,邊框,高和寬來控制的大小以及與其他物件之間的位置關係。

浮動是從網頁布局的角度來定義元素的顯示,而行內和塊狀屬性主要是從元素自身的性質來定其顯示的。

當元素沒有定義邊框時,可以把內邊距作為外邊距使用。有時候外邊距會有重疊現象的。

當為元素定義背景影象時,內邊距區域內可以顯示背景影象,而對外邊距區域來說,背景影象是達不到的,他永遠都是透明狀態

用div+css設計網頁結構時,設計師滿腦子都是網頁內容,而非內容所呈現的效果。

塊狀元素:不管塊狀元素寬度是多少,他總會自動佔據一行,因為在他末尾附加了乙個換行符,而行內元素沒有這個特點。塊狀元素有完整的盒模型結構,可以定義寬度和高度,而行內元素沒有這個特性,無法通過高度來改變文字行的行高。

塊元素的代表標記 div

行內元素的代表標記 span ,行內標記不具備組織結構框架

網頁布局分為:自然布局,浮動布局, 定位布局

當乙個元素被定義為浮動顯示時,即定義為塊狀元素。並且該元素就會收縮自身體積為最小狀態。所以,應該有個好的習慣即把浮動元素設定高和寬。如果沒有設定,則元素會按照它所包含的內容大小來確定它的大小。

當元素浮動後,周邊的物件會自動環繞浮動元素周圍,形成一種環繞關係。

塊狀元素之間的外邊距會有重疊現象,但是浮動元素之間的外邊距不會發聲重疊現象。

浮動元素移動,上移:margin-top:-**; 下移:margin-botom:-*px,其他以此類推。

一般定位元素(絕對或是相對元素)都會覆蓋在文件流物件之上。但是,select元素的視窗控制項還不完全支援z-index

在css定位布局中,一般遵循「外部相對定位,內部絕對定位」

在body中設定min-width:,可以避免布局重疊現象。

HTML基礎規範

1 文章內容應該放在article標籤中,作者放在author標籤中,時間寫在time標籤 中 2 標籤不要忘了alt屬性,便於檢索 3 元素應該有完整的格式 4 表單元素統一包含在form元素裡面,注意養成規範,帶有提交的表單元素,form應該加上action屬性和method屬性,action屬...

html命名規範

default index.html 首頁 404.html 404錯誤頁 print.html 列印頁 header.html 頁頭 footer.html 頁尾 passport.html 通行證 rank.html 排行榜 roll.html 滾動新聞 solution.html 解決方案 j...

HTML 編碼規範

firstli secondli ul body 在頁面開頭使用這個簡單的 doctype 來啟用標準模式,使其在每個瀏覽器中盡可能一致的展現 雖然 doctype 不區分大小寫,但是按照慣例,doctype 使用全大寫 doctype html 根據html5規範 應在 html 標籤上加上 la...