CSS元素的显示模式

最新推荐文章于 2023-06-22 14:32:23 发布

黑马程序员小张

最新推荐文章于 2023-06-22 14:32:23 发布

阅读量398

点赞数 1

文章标签： html5 css

本文链接：https://blog.csdn.net/z000802/article/details/123909847

版权

1.块级模式

显示特点：
1. 独占一行(一行只能显示一个)
2. 宽度默认是父元素的宽度，高度默认由内容撑开
3. 可以设置宽高
代表标签：
- div、p、h系列、ul、li、dl、dt、dd、form、header、Nav、footer........

 <style>
        /* 块级元素：独占一行 宽度默认是父级的100%，添加宽高都生效 */
        div {
            width: 300px;
            height: 300px;
            background-color: pink;


            /* 行内块 */
            /* display: inline-block; */

            /* 行内 */
            display: inline;
        }
    </style>
</head>

<body>
    <div>1111111</div>
    <div>2222222</div>
</body>

2.行内元素

显示特点：
1. 一行可以显示多个
2. 宽度和高度默认由内容撑开
3. 不可以设置宽高
代表标签：

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

黑马程序员小张

关注关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
CSS元素的显示模式

1.块级模式显示特点：独占一行(一行只能显示一个) 宽度默认是父元素的宽度，高度默认由内容撑开可以设置宽高代表标签： div、p、h系列、ul、li、dl、dt、dd、form、header、Nav、footer........ <style> /* 块级元素：独占一行宽度默认是父级的100%，添加宽高都生效 */ div { width: 3
复制链接

扫一扫