css 块级元素 行级元素

CSS（Cascading Style Sheets）是一种用来描述网页样式的语言。其中，块级元素和行级元素是CSS中最基本的元素类型，它们影响了网页的布局及样式。

块级元素是指那些默认情况下在页面上占据整行的元素，而且相互之间会有一定的间距。我们可以使用CSS样式属性对其进行设置，例如可以设置其宽度（width）、高度（height）、背景色（background-color）等等。常见的块级元素有：

p>
    段落/p>
    div>
    分区/div>
    ul>
    无序列表/ul>
    ol>
    有序列表/ol>
    hr>
    水平分割线/hr>
    

每个块级元素都会从新行开始，并会撑满其父容器的宽度。我们还可以通过CSS设置块级元素的样式，例如设置其字体、对齐方式（text-align）、内边距（padding）、边框（border）等等。

行级元素则是仅占据其自身宽度的元素，且它们一般都是嵌套在块级元素中的。常见的行级元素包括：

a>
    超链接/a>
    span>
    内联区域/span>
    img>
    图片/img>
    button>
    按钮/button>

行级元素不会换行，它们的宽度和高度只能由其内容所决定。如果我们想要使用CSS样式属性控制行级元素的宽度和高度，需要先将其转换为块级元素，可以使用display属性来进行设置。

span {
        /* 通过display设置为块级元素 */    display: block;
        width: 200px;
        height: 50px;
        border: 1px solid black;
        background-color: yellow;
}
    

在真实的网页中，块级元素和行级元素的使用非常普遍，我们需要根据不同的需求对其进行选择和设置，以达到最佳的页面美观度和用户体验。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！