铁柱%* 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 BP神经网络控制倒立摆
  • ¥20 要这个数学建模编程的代码 并且能完整允许出来结果 完整的过程和数据的结果
  • ¥15 html5+css和javascript有人可以帮吗?图片要怎么插入代码里面啊
  • ¥30 Unity接入微信SDK 无法开启摄像头
  • ¥20 有偿 写代码 要用特定的软件anaconda 里的jvpyter 用python3写
  • ¥20 cad图纸,chx-3六轴码垛机器人
  • ¥15 移动摄像头专网需要解vlan
  • ¥20 access多表提取相同字段数据并合并
  • ¥20 基于MSP430f5529的MPU6050驱动,求出欧拉角
  • ¥20 Java-Oj-桌布的计算