首頁 > web前端 > html教學 > 用CSS实现div等高_html/css_WEB-ITnose

用CSS实现div等高_html/css_WEB-ITnose

WBOY
發布: 2016-06-24 12:26:58
原創
1113 人瀏覽過

方法1:兼容IE6.7.8.9.10.FF.Chrome

   

   

        .wrap {

            width: 500px;

            margin: auto;

            overflow: hidden;

        }

 

        .left, .right {

            padding-bottom: 32767px;

            margin-bottom: -32767px;

            color: white;

        }

 

        .left {

            background-color: #000;

            width: 200px;

            float: left;

            height: 800px;

        }

 

        .right {

            background-color: red;

            width: 300px;

            float: right;

        }

   

   

       

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

       

       

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

       

   

 

 

方法2:

这个方法的优点:

代码少,简单

缺点:不兼容IE7.6

   

   

        * {

            margin:0;

            padding:0;

            border:0;

            list-style:none;

        }

        .cell1, .cell2, .cell3 {

            display:table-cell;

            width:180px;

            padding-left:10px;

            background-color:#ff6a00;

            border:1px solid #00ffff;

        }

   

   

       

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

           

aaa

       

       

           

aaa

           

aaa

           

aaa

           

aaa

       

       

           

aaa

           

aaa

       

   

 

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板