html
標籤按照元素種類可以分為行內元素(display: inline);,塊級元素(display:block)和行內塊級元素(display:inline-block)三種。了解元素種類有利於,我們進行css
布局及屬性的使用。
也叫內聯元素或內嵌元素,只能容納文字或其他內聯元素。
預設特點:
示例:
關關雎鳩
所謂伊人
在水一方
在河之洲
效果:
常見行內元素:
標籤意義a錨點
abbr
縮寫acronym首字b
粗體(不推薦)
big大字型
br換行
cite
引用code
**dfn
定義字段
em強調
font
字型設定(不推薦)i斜體
imginput
輸入框kbd
定義鍵盤文字
label
**標籤
q短引用
s中劃線(不推薦)
samp
定義範例計算機**
select
專案選擇
small
小字型文字
span
定義文字內區塊(常用)
strike
中劃線strong
粗體強調
sub下標
sup上標
textarea
多行文字輸入框
tt電傳文字
u下劃線
塊級元素一般可巢狀塊級元素或行內元素
預設特點:
示例:
關關雎鳩
在河之洲
窈窕淑女
君子好逑
效果:
常見的塊級元素:
標籤意義
address
位址blockquote
塊引用center
局中對齊塊
dir目錄列表
div常用塊級容易(常用)
dl定義列表
fieldset
form控制組
form
互動表單
h1大標題
h2副標題
h3**標題
h4四級標題
h5物級標題
h6六級標題
hr水平分隔線
menu
選單列表
noframes
frames可選內容
noscript
可選指令碼內容
ol有序表單p段落
pre格式化文字
table
** (display:table)
ul無序列表
既有行內元素的一些特性又有塊級元素的一些特性。
預設特點:
常見行內塊級元素:
標籤意義
button
按鈕input
輸入框img
iframe
框架textarea
多行文字框
select
選項三種元素都可通過css
改變display
屬性切換元素型別
行內元素與塊級元素對比:
行內元素
塊級元素
排在一行
獨佔一行
寬度隨內容變化
容器的100%
height
,width
無效
height
,width
有效
padding
,margin
水平有效,垂直無效
padding
,margin
水平,垂直均有效
display:inline
dispaly: block
塊級元素,行內元素,行內塊元素
內聯元素 行內元素 內聯元素 inline element 行內塊元素 a 錨點 abbr 縮寫 acronym 首字 b 粗體 不推薦 bdo bidi override big 大字型 br 換行 cite 引用 code 計算機 在引用原始碼的時候需要 dfn 定義字段 em 強調 font ...
塊級元素,行內元素,行內塊元素
獨佔一行,對寬高的屬性值生效 如果不給寬度,預設為瀏覽器的寬度即100 塊標籤 p div ul ol li dl dt dd h1 h6 form 可以多個標籤存在一行,對寬高的屬性值不生效,靠內容撐開 行內標籤 a span em strong b i u label br 結合行內和塊級元素的...
CSS塊級元素 行內元素 行內塊級元素
塊級元素 根據css規範的規定,每乙個網頁元素都有乙個display屬性,用於確定該元素的型別,每乙個元素都有預設的display屬性值,比如div元素,它的預設display屬性值為 block 成為塊級元素 display block 常見塊級元素 div p ul ol li 等 1 每個塊級...