铁柱%* 2021-05-10 22:31 采纳率: 87.5%
浏览 22
已采纳

div+css布局 3是我的结果 4是效果图 不知道哪里出错

div+css布局 3是我的结果 4是效果图 不知道哪里出错
  • 写回答

1条回答 默认 最新

  • wanmeikakaxi 2021-05-11 09:17
    关注

    参考一下我给你修改好的吧，下次如果提问，最好把代码贴上来，不然你的问题无人问津。

    满意的话，记得采纳答案，谢谢。

    动态演示图

    代码 

    <!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
.top01 {
    background-color: #f00;
    padding: 0px 50px 100px 50px;
    width: 100px;
    text-align: center;
    float: left;
}
.top02 {
    float: right;
    background-color: green;
    padding: 0px 20px 20px 20px;
    text-align: center;
}
.daohacgtiao {
    padding: 0px 0px 20px 50px;
    background-color: green;
    text-align: center;
    clear: both;
}
#box {
    width: 100%;
    display: flex;
    margin-top: 5px;
}

.body000 div {
    background-color: #05ecf7;
    margin: 0 0 10px;
    width: 300px;
    height: 200px;
    text-align: center;
}

.a00 {
    width: 100%;
}
.a00 div {
    margin: 0px 10px 10px 10px;
}
.body04 {
    height: 300px;
    background-color: #87CEEB;
    text-align: center;
}
.body05 {
    height: 300px;
    background-color: #87CEEB;
    text-align: center;
}
.body06 {
    width: 300px;
    height: 600px;
    background-color: purple;
    float: left;
    text-align: center;
}
.last {
    background-color: pink;
    padding: 50px;
}
	</style>
	</head>

<body>
<div class="top">
     <div class="top01">logo</div>
     <div class="top02">语言选择</div>
</div>
<div class="daohacgtiao">导航条</div>
    <div id="box">
		<div class="body000">
       <div class="body010">客户服务</div>
       <div class="body020">精彩视频</div>
       <div class="body030">征信系统共享成员</div>
    </div>
    <div class="a00">
       <div class="body04">核心业务</div>
       <div class="body05">征信系统问答</div>
    </div>
       <div class="body06">征信动态</div>
    </div>
<div class="last"></div>
 </body>
</html>
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题？

悬赏问题

  • ¥15 如何在scanpy上做差异基因和通路富集？
  • ¥20 关于#硬件工程#的问题，请各位专家解答！
  • ¥15 关于#matlab#的问题：期望的系统闭环传递函数为G(s)=wn^2/s^2+2¢wn+wn^2阻尼系数¢=0.707，使系统具有较小的超调量
  • ¥15 FLUENT如何实现在堆积颗粒的上表面加载高斯热源
  • ¥30 截图中的mathematics程序转换成matlab
  • ¥15 动力学代码报错，维度不匹配
  • ¥15 Power query添加列问题
  • ¥50 Kubernetes&Fission&Eleasticsearch
  • ¥15 報錯：Person is not mapped，如何解決？
  • ¥15 c++头文件不能识别CDialog