HTML 元素類型

每一個HTML元素都有一個默認的顯示值砚著,它都取決于元素的類型次伶。在CSS中,根據(jù)它的分類我們可以把HTML元素分為三種類型:塊狀元素(block)稽穆、內(nèi)聯(lián)元素(inline)以及內(nèi)聯(lián)塊狀元素(inline-block)冠王。

塊狀元素

  • 標簽獨自占據(jù)一行,相鄰塊狀元素不會并列顯示舌镶,且它的順序是自上而下的排列柱彻;
  • 在網(wǎng)頁中以塊的形式顯示為矩形區(qū)域;
  • 所有塊狀元素都可以定義自己的寬度和高度餐胀;
  • 作為其他元素的容器哟楷,可以容納其他內(nèi)聯(lián)和塊狀元素。

塊級元素總是從新的一行開始并占據(jù)可用的全寬度(進可能向左右延伸):

    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
    </ul>

常見的塊級元素有(大多為結(jié)構(gòu)性標記):

<h1> ~ <h6>骂澄、<p>吓蘑、<div><ul>坟冲、<ol>磨镶、<li><dl>健提、<dt>琳猫、<dd><table>私痹、<form>脐嫂、<hr><pre>紊遵、<blockquote>账千、<marquee><address>暗膜、<article>匀奏、<aside><canvas>学搜、<fieldset>娃善、<figcaption>论衍、<figure><footer>聚磺、<header>坯台、<main><nav>瘫寝、<noscript>蜒蕾、<section><tfoot>矢沿、<video>滥搭、 等。

內(nèi)聯(lián)元素(行內(nèi)元素)

  • 標簽在一行內(nèi)捣鲸,寬度和高度由內(nèi)容決定,只有在內(nèi)容超過HTML的寬度時闽坡,才會換行栽惶;
  • 表現(xiàn)形式始終以行內(nèi)逐個進行顯示;
  • 沒有自己的形狀疾嗅,不能定義寬高外厂,最小內(nèi)容單元也呈現(xiàn)矩形形狀;
  • 遵循盒子模型基本規(guī)則代承。

內(nèi)聯(lián)元素不從新行開始汁蝶,只占用所需的寬度:

    <span>內(nèi)聯(lián)元素</span>

常見的內(nèi)聯(lián)元素有(大多為描述性標記):

<span><a>论悴、<em>掖棉、<abbr><acronym>膀估、<bdo>幔亥、<b><big>察纯、<button>帕棉、<bfn><kbd>饼记、<map>香伴、<object><output>具则、<samp>即纲、<script><small>乡洼、<sup>崇裁、<sub>匕坯、<time><tt>拔稳、<q>葛峻、<var><cite>巴比、<code>术奖、<label><br>轻绞、<i>采记、<select><strong> 等政勃。

內(nèi)聯(lián)塊狀元素

同時具備內(nèi)聯(lián)元素和塊狀元素的特點唧龄。

常見的內(nèi)聯(lián)元素有:<img><input>

課后小練習

  1. HTML 元素類型我們可以分為哪幾類奸远?
  2. 分別寫說html不同類型元素(標簽最少不低于5個)
  3. 分別寫出多種元素類型的不同特點
  4. 通過對三種元素的認識與初步了解既棺,三者之間的差距和共同點有哪些呢?
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末懒叛,一起剝皮案震驚了整個濱河市丸冕,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌薛窥,老刑警劉巖胖烛,帶你破解...
    沈念sama閱讀 221,635評論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異诅迷,居然都是意外死亡佩番,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,543評論 3 399
  • 文/潘曉璐 我一進店門竟贯,熙熙樓的掌柜王于貴愁眉苦臉地迎上來答捕,“玉大人,你說我怎么就攤上這事屑那」案洌” “怎么了?”我有些...
    開封第一講書人閱讀 168,083評論 0 360
  • 文/不壞的土叔 我叫張陵持际,是天一觀的道長沃琅。 經(jīng)常有香客問我,道長蜘欲,這世上最難降的妖魔是什么益眉? 我笑而不...
    開封第一講書人閱讀 59,640評論 1 296
  • 正文 為了忘掉前任,我火速辦了婚禮,結(jié)果婚禮上郭脂,老公的妹妹穿的比我還像新娘年碘。我一直安慰自己,他們只是感情好展鸡,可當我...
    茶點故事閱讀 68,640評論 6 397
  • 文/花漫 我一把揭開白布屿衅。 她就那樣靜靜地躺著,像睡著了一般莹弊。 火紅的嫁衣襯著肌膚如雪涤久。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 52,262評論 1 308
  • 那天忍弛,我揣著相機與錄音响迂,去河邊找鬼。 笑死细疚,一個胖子當著我的面吹牛蔗彤,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播惠昔,決...
    沈念sama閱讀 40,833評論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼幕与,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了镇防?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,736評論 0 276
  • 序言:老撾萬榮一對情侶失蹤潮饱,失蹤者是張志新(化名)和其女友劉穎来氧,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體香拉,經(jīng)...
    沈念sama閱讀 46,280評論 1 319
  • 正文 獨居荒郊野嶺守林人離奇死亡啦扬,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,369評論 3 340
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了凫碌。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片扑毡。...
    茶點故事閱讀 40,503評論 1 352
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖盛险,靈堂內(nèi)的尸體忽然破棺而出瞄摊,到底是詐尸還是另有隱情,我是刑警寧澤苦掘,帶...
    沈念sama閱讀 36,185評論 5 350
  • 正文 年R本政府宣布换帜,位于F島的核電站,受9級特大地震影響鹤啡,放射性物質(zhì)發(fā)生泄漏惯驼。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,870評論 3 333
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望祟牲。 院中可真熱鬧隙畜,春花似錦、人聲如沸说贝。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,340評論 0 24
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽狂丝。三九已至换淆,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間几颜,已是汗流浹背倍试。 一陣腳步聲響...
    開封第一講書人閱讀 33,460評論 1 272
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人狐树。 一個月前我還...
    沈念sama閱讀 48,909評論 3 376
  • 正文 我出身青樓迫悠,卻偏偏與公主長得像,于是被迫代替她去往敵國和親躁愿。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 45,512評論 2 359

推薦閱讀更多精彩內(nèi)容

  • 一沪蓬、html元素類型 html元素分為三類: 塊元素彤钟,內(nèi)聯(lián)元素(行內(nèi)元素),可變元素 注:html元素也可分為:塊...
    jiaiqi閱讀 1,967評論 1 1
  • HTML元素分類 根據(jù)css顯示分類,HTML元素被分為三種類型:塊狀元素跷叉,內(nèi)聯(lián)元素逸雹,可變元素 1.塊狀元素(bl...
    千鋒H5閱讀 360評論 0 0
  • HTML中標簽元素三種不同類型:塊元素,行內(nèi)元素云挟,行內(nèi)塊元素梆砸。三者的主要區(qū)別在于生成方式不同,布局表現(xiàn)不同园欣,屬性設...
    小黑兔斯基閱讀 212評論 0 0
  • 本文主要是起筆記的作用帖世,內(nèi)容來自慕課網(wǎng). 認識CSS樣式 CSS全稱為“層疊樣式表 (Cascading Styl...
    0o凍僵的企鵝o0閱讀 2,651評論 0 30
  • css元素類型的分類,css 元素類型的轉(zhuǎn)換,css float,css inline-block元素類型的應用 ...
    小五丶_閱讀 321評論 0 0