zoukankan      html  css  js  c++  java
  • css实现自适应屏幕高度和双飞翼布局

    <!DOCTYPE html>

    <html>

    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

    <title>双飞翼布局</title>

    <style>

    body,html{margin:0;height:100%;color:#fff;} /*首先在这里设置高度为100%,子元素才能设置高度为100%实现自适应屏幕高度

    .content{100%;height:100%;margin:0 auto;background:#aef;}

    .main2{float:left;100%;}

    .in{margin:0 230px 0 190px;background:#C0F;}

    .left2{float:left;190px;margin-left:-100%;background:#03F;}

    .right2{float:left;230px;margin-left:-230px;background:#63F;}

    </style>

    </head>

    <body>

      <div class="content">   

      <div class="main2">      

        <div class="in">main</div>   

      </div>   

      <div class="left2">left</div>   

      <div class="right2">right</div>

    </div>

    </body>

    </html>

  • 相关阅读:
    学习进度十二
    学习情况记录 11
    2020寒假 13
    学习情况记录 10
    学习情况记录 09
    2020寒假 12
    学习情况记录 08
    2020寒假 11
    学习情况记录 07
    2020寒假 10
  • 原文地址:https://www.cnblogs.com/lvke/p/4315268.html
Copyright © 2011-2022 走看看