HTML块级元素和内联元素的区别

块级元素和内联元素的区别

显示方式不同
1、块级元素：是块元素都从新行开始，相邻的块级元素将会在不同行显示。

2、内联元素：一个挨着一个，都在同一行按从左至右的顺序显示，不单独占一行。

二、高度不同

1、块级元素：高度，行高以及外边距和内边距都可控制，以容纳内联元素和其他块元素。

2、内联元素：高度、行高和顶以及底边距都不可改变。


宽度设置不同

1、块级元素：宽度缺省是它的容器的100%，除非设定一个宽度。

2、内联元素：宽度就是它的文字或图片的宽度，不可改变。

<!-- 块级元素 -->
    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Adipisci nesciunt accusantium eveniet aperiam ullam
        molestiae reiciendis ipsa dolorem fuga, eos recusandae non saepe corrupti numquam placeat architecto modi minus
        cum.</p>
    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Adipisci nesciunt accusantium eveniet aperiam ullam
        molestiae reiciendis ipsa dolorem fuga, eos recusandae non saepe corrupti numquam placeat architecto modi minus
        cum.</p>
    <ul>
        <li>item1</li>
        <li>item2</li>
        <li>item3</li>
        <li>item4</li>
    </ul>
    <!-- 内联元素 -->
    <a href="#">链接1</a>
    <a href="#">链接2</a>
    <a href="#">链接3</a>
    <a href="#">链接4</a>
    ```