css之block和inline元素的特點(diǎn)

申請(qǐng)免費(fèi)試用、咨詢電話：400-8352-114

    所有的HTML元素都屬于block和inline之一。block和inline元素的特點(diǎn)是什么呢？撫州網(wǎng)站制作公司來(lái)告訴你。

一、block元素特點(diǎn)

    總是在新行上開(kāi)始；
    高度，行高以及頂和底邊距都可控制；
    寬度缺省是它的容器的100%，除非設(shè)定一個(gè)寬度
    <div>, <p>, <h1>, <form>, <ul> 和 <li>是塊元素的例子。

    display:block;
    是讓對(duì)象成為塊級(jí)元素(比如a，span等)
    display有很多對(duì)象，具體可以參考W3C的介紹
    一般都是用display:none和display:block來(lái)控制層的顯示

    對(duì)于HTML等文檔類型，如果使用display不謹(jǐn)慎會(huì)很危險(xiǎn)，因?yàn)榭赡苓`反HTML中已經(jīng)定義的顯示層次結(jié)構(gòu)。對(duì)于XML，由于XML沒(méi)有內(nèi)置的這種層次結(jié)構(gòu)，所有display是絕對(duì)必要的。

二、inline元素特點(diǎn)

    和其他元素都在一行上；
    高，行高及頂和底邊距不可改變；
    寬度就是它的文字或圖片的寬度，不可改變。
    <span>, <a>, <label>, <input>, <img>, <strong> 和<em>是inline元素的例子。

    用display: inline 或display: block命令就可以改變一個(gè)元素的這一特性。什么時(shí)候需要改變這一屬性呢？讓一個(gè)inline元素從新行開(kāi)始，讓塊元素和其他元素保持在一行上，控制inline元素的寬度（對(duì)導(dǎo)航條特別有用），控制inline元素的高度，無(wú)須設(shè)定寬度即可為一個(gè)塊元素設(shè)定與文字同寬的背景色。