lianyang506277 2017-10-30 21:19 采纳率: 10%
浏览 2640

div如何做到自适应......

父级div高度100%,里面有三个子div,上中下排列,三个子div高度都是自适应的,且顺序不固定,求大神指点

  • 写回答

7条回答 默认 最新

  • Java精选 2017-10-30 21:27
    关注

    图片说明

    评论
  • Java精选 2017-10-30 21:28
    关注
     <div style="border: 1px solid #ccc;width:100%;float:left;height:30px;s"></div>
    <div style="border: 1px solid #bbb;width:100%;float:left;height:30px;"></div>
    <div style="border: 1px solid #aaa;width:100%;float:left;height:30px;"></div>
    

    欢迎收藏素文宅博客:blog.yoodb.com

    评论
  • coder-wen95 2017-10-30 21:35
    关注

    你是说父级怎么自适应吗?要是父级的话添加个类father可以用添加个伪类:after
    然后设置.father:after{content:''; display:block; clear:both;}

    评论
  • jasondyoung 2017-10-30 21:39
    关注

    子div的样式给width:100%;height:33%;

     <div style="height:100%;">
            <div style="width:100%;height:33%;border:1px solid red;">s</div>
            <div style="width:100%;height:33%;border:1px solid red;">s</div>
            <div style="width:100%;height:33%;border:1px solid red;">s</div>
    
    
        </div>
    
    评论
  • 问问那只猫 2017-11-01 00:35
    关注

    如果子div宽度都是100%的话,父div是会被三个子div高度撑开的,如果你子div都是用的float的话,建议给父div清除浮动~

    评论
  • ScriptTao 2017-11-07 21:35
    关注

    你可以看看bootstrap里面的栅格系统,方便很多

    评论
  • qq_35285375 2017-11-09 05:55
    关注

    设置 三个div float:left

    评论
编辑
预览

报告相同问题?

悬赏问题

  • ¥15 设计一个光控计数器,全部用ttl芯片
  • ¥15 vscode platformio
  • ¥15 代写uni代码,app唤醒
  • ¥15 全志t113i启动qt应用程序提示internal error
  • ¥15 ensp可以看看嘛.
  • ¥80 51单片机C语言代码解决单片机为AT89C52是清翔单片机
  • ¥60 优博讯DT50高通安卓11系统刷完机自动进去fastboot模式
  • ¥15 minist数字识别
  • ¥15 在安装gym库的pygame时遇到问题,不知道如何解决
  • ¥20 uniapp中的webview 使用的是本地的vue页面,在模拟器上显示无法打开
手机看
程序员都在用的中文IT技术交流社区

程序员都在用的中文IT技术交流社区

专业的中文 IT 技术社区,与千万技术人共成长

专业的中文 IT 技术社区,与千万技术人共成长

关注【CSDN】视频号,行业资讯、技术分享精彩不断,直播好礼送不停!

关注【CSDN】视频号,行业资讯、技术分享精彩不断,直播好礼送不停!

客服 返回
顶部