---
tags: css
---

# display

### display: block ==區塊元素==

#### 區塊元素 特性

* 盡可能佔滿整個版面。
* 如果寬有限制他還是會另起一行來呈現。


* 若在a連結就沒有區塊元素，無法占滿整個網頁

 <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Officia consequatur magni, placeat quibusdam unde
        voluptate nemo fuga, adipisci cupiditate quidem, dolores maxime praesentium accusantium culpa est! Quia aliquid
        accusamus corporis?</p>
    <ul>
        <li>123</li>
        <li>456</li>
    </ul>
    <a href="">aa</a>
    <a href="">bb</a>


### display: inline; ==行內元素==

#### 行內元素 特性

* 通常用來點綴用。
* 沒辦法去設定寬跟高 (除非轉回區塊元素)

 <p>Lorem ipsum dolor sit <a>123</a>amet consectetur adipisicing elit. Officia consequatur magni, placeat quibusdam
        unde
        voluptate nemo<span>345</span>> fuga, adipisci cupiditate quidem, dolores maxime praesentium accusantium culpa
        est!
        Quia aliquid
        accusamus corporis?</p>