html行內元素與塊內元素分別有哪一些?html行內元素與塊內元素的特點說明
發表時間:2023-09-06 來源:明輝站整理相關軟件相關文章人氣:
[摘要]html行內元素有哪些?html塊內元素有哪些?本文介紹了哪些是行內元素,哪些是塊級元素,他們的特點和區別。HTML行內元素(inline element)的特點:行內元素也叫內聯元素或者內嵌元素。行內元素和其他元素都在一行上,高度、行高、內邊距和外邊距都不可改變。寬度是它文字或者圖片的寬度,也是...
html行內元素有哪些?html塊內元素有哪些?本文介紹了哪些是行內元素,哪些是塊級元素,他們的特點和區別。
HTML行內元素(inline element)的特點:
行內元素也叫內聯元素或者內嵌元素。行內元素和其他元素都在一行上,高度、行高、內邊距和外邊距都不可改變。寬度是它文字或者圖片的寬度,也是不可改變的。行內元素只能容納文本或者其他行內元素。
之前文章中講到的 a,img,br是行內元素。
塊級(block)元素的特點:
①總是在新行上開始;
②高度,行高以及外邊距和內邊距都可控制;
③寬度缺省是它的容器的100%,除非設定一個寬度;
④它可以容納內聯元素和其他塊元素。
內聯(inline)元素的特點:
①和其他元素都在一行上;
②高,行高及外邊距和內邊距不可改變;
③寬度就是它的文字或圖片的寬度,不可改變;
④內聯元素只能容納文本或者其他內聯元素。
關于行內元素和塊狀元素的說明:
根據CSS規范的規定,每一個網頁元素都有一個display屬性,用于確定該元素的類型,每一個元素都有默認的display屬性值,比如div元素,它的默認display屬性值為“block”,成為“塊級”元素(block-level);而span元素的默認display屬性值為“inline”,稱為“行內”元素。div這樣的塊級元素,就會自動占據一定矩形空間,可以通過設置高度、寬度、內外邊距等屬性,來調整的這個矩形的樣子;與之相反,像“span”“a”這樣的行內元素,則沒有自己的獨立空間,它是依附于其他塊級元素存在的,因此,對行內元素設置高度、寬度、內外邊距等屬性,都是無效的。
行內、塊狀元素區別:
(1).塊級元素會獨占一行,其寬度自動填滿其父元素寬度
行內元素不會獨占一行,相鄰的行內元素會排列在同一行里,知道一行排不下,才會換行,其寬度隨元素的內容而變化
(2). 一般情況下,塊級元素可以設置 width, height屬性,行內元素設置width, height無效
(注意:塊級元素即使設置了寬度,仍然是獨占一行的)
(3).塊級元素可以設置margin 和 padding. 行內元素的水平方向的padding-left,padding-right,margin-left,margin-right 都產生邊距效果,但是豎直方向的padding-top,padding-bottom,margin-top,margin-bottom都不會產生邊距效果。(水平方向有效,豎直方向無效)
行元素和塊元素分別有哪些:
塊元素(block element)
address - 地址
blockquote - 塊引用
center - 舉中對齊塊
dir - 目錄列表
div - 常用塊級容易,也是css layout的主要標簽
dl - 定義列表
fieldset - form控制組
form - 交互表單
h1 - 大標題
h2 - 副標題
h3 - 3級標題
h4 - 4級標題
h5 - 5級標題
h6 - 6級標題
hr - 水平分隔線
menu - 菜單列表
noframes - frames可選內容,(對于不支持frame的瀏覽器顯示此區塊內容
noscript - 可選腳本內容(對于不支持script的瀏覽器顯示此內容)
ol - 排序表單
p - 段落
pre - 格式化文本
able - 表格
ul - 非排序列表
內聯元素(inline element)(行內元素)
a - 錨點
abbr - 縮寫
acronym - 首字
b - 粗體(不推薦)
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 - 定義變量
【相關推薦】
HTML5是什么,HTML5有哪些特性和優缺點?
html的基礎元素,讓你零基礎學習HTML
以上就是html行內元素和塊內元素分別有哪些?html行內元素和塊內元素的特點介紹的詳細內容,更多請關注php中文網其它相關文章!
網站建設是一個廣義的術語,涵蓋了許多不同的技能和學科中所使用的生產和維護的網站。