盒子的垂直布局

最新推荐文章于 2022-06-22 10:28:01 发布

Double_路

最新推荐文章于 2022-06-22 10:28:01 发布

阅读量316

点赞数

分类专栏： CSS 文章标签： css3 html5

本文链接：https://blog.csdn.net/qq_44606245/article/details/109491714

版权

CSS 专栏收录该内容

11 篇文章 0 订阅

订阅专栏

盒子的垂直布局

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>垂直方向的布局</title>
    <style>
        .box1{
            background-color: silver;
            height: 200px;
            overflow: visible;
        }
        .inner{
            height:300px;
            width: 100px;
            background-color: skyblue;
            margin-bottom: 20px;

        }
    </style>
</head>
<body>
    <!-- 
        默认情况下,父元素的高度被内容撑开

        子元素是在父元素中排列的，如果子元素的大小超过了父元素，则从父元素中溢出
        使用overflow设置元素的溢出，设置父元素如何处理溢出的子元素，在父元素中设置
        可选值
            visible  默认值
            hidden   隐藏   溢出的部分被裁剪
            scroll   生成滚动条，来查看完整的内容
            auto     根据需要生成滚动条
     -->
    <div class="box1">
        <div class="inner"></div>
    </div>
</body>
</html>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

Double_路

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
盒子的垂直布局

盒子的垂直布局<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>垂直方向的布局</title> <style> .box1{
复制链接

扫一扫