CSS进阶-13-显示模式-块

最新推荐文章于 2024-11-01 10:52:38 发布

Keep learning（Poker）

最新推荐文章于 2024-11-01 10:52:38 发布

阅读量162

点赞数

文章标签： css html 前端

本文链接：https://blog.csdn.net/weixin_63562705/article/details/121825724

版权

三、元素显示模式

1.1 块级元素

★显示特点:

1.独占一行(一行只能显示一个)

2.宽度默认是父元素的宽度, 高度默认由内容撑开

3.可以设置宽高

★代表标签:

· div、 p、h系列、ul、li、 dl、 dt、dd、form、header、nav、footer......

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=\, initial-scale=1.0">
    <title>Document</title>
    <style>
        /* 块：独占一行；宽度默认是父级100%；添加宽度都生效 */
        div{
            width: 300px;
            height: 300px;
            background-color: pink;
        }
    </style>
</head>
<body>
    <div>11111</div>
    <div>22222</div>
</body>
</html>