html中section与div,如何在html中的section标签内包含div标签

我正在制作一个完整版块的页面网站,如this。每个页面都有自己的标签。目前我的网页有4个部分(呈现不同的背景颜色)。如何在html中的section标签内包含div标签

我的第一部分有一个容器div,里面有两个新的div(一个用于图像,另一个用于描述)。现在,当窗口最小化时,说明内容溢出并转到第二页,而不是包含在第一页中。举例说明:

4rSJv.png

请让我知道做了哪些更改。我一直在这个问题上很长一段时间,我还没有找到一个资源或解决方案,为我的代码工作..

我的HTML代码:

about.jpeg

Lorem Ipsum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Suspendisse malesuada lacus commodo enim varius,
non gravida ipsum faucibus.

Vivamus pretium pulvinar
elementum. In vehicula ut elit vitae dapibus.

Cras ipsum
neque, finibus id mattis vehicula, rhoncus in mauris.

In
hendrerit vitae velit vel consequat. Duis eleifend dui vel
tempor

maximus. Aliquam rutrum id dolor vel ullamcorper.
Nunc cursus sapien

a ex porta dictum.

我的CSS:

* {margin:0;padding:0;box-sizing:border-box}

html, body {width: 100%;}

* {box-sizing: border-box;}

html, body {

height:100%;

position: relative;

}

section{

width: 100%;

height:100vh;

}

.content{

display: table-cell;

height: 100vh;

}

/* ABOUT */

#about {

border-bottom: #F1C40F 5px solid;

display: flex;

justify-content: space-evenly;

align-items: center;

}

#aboutImage {

padding: 30px 30px 30px 30px;

}

#aboutInfo {

border-style: dashed;

border-width: 2px;

border-color: black;

font-size: 30px;

text-align: left;

}

#aboutInfo p {

font-size: 15px;

}

/* SECOND PAGE*/

#skills {

background-color: #E3E7D3;

}

/* RESPONSIVE DESIGN */

@media screen and (max-width: 768px){

#about {

flex-direction: column; /* added */

}

}

请让我知道如何解决这个问题。我一直有这么多麻烦。

2017-10-13

dollaza

+0

玩弄“溢出” - 你可能会显示它,当你想剪辑它,或使用滚动条。 –

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值