zoukankan      html  css  js  c++  java
  • 固定高度div,随内容自动变高css定义方法

    *{ font-size:12px; margin:0; padding:0;}
    方法1:
    #testBox{border:1px solid #cccccc;padding:5px;220px;
    min-height:100px; /*高度最小值设置为:100px*/
    height:auto !important; /*兼容FF,IE7也支持 !important标签*/
    height:100px; /*兼容ie6*/
    方法2:
    /*单独用下面这个方法也可以实现*/
    height:expression(this.height < 100 ? "100px" : this.height+"px");

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    </head>
    <style type="text/css">
    *{ font-size:12px; margin:0; padding:0;}
    #testBox{border:1px solid #cccccc;padding:5px;220px;
    min-height:100px; /*高度最小值设置为:100px*/
    height:auto !important; /*兼容FF,IE7也支持 !important标签*/
    height:100px; /*兼容ie6*/

    /*单独用下面这个方法也可以实现*/
    /*height:expression(this.height < 100 ? "100px" : this.height+"px");*/
    }
    </style>
    <body>
    <div id="testBox">
    <ul>
    <!--只有一条记录时是默认高度-->
    <li>这里是每一条内。。。。。</li>
    <!--删除注释后,高度随之增加。
    <li>这里是每一条内。。。。。</li>
    <li>这里是每一条内。。。。。</li>
    <li>这里是每一条内。。。。。</li>
    <li>这里是每一条内。。。。。</li>
    <li>这里是每一条内。。。。。</li>
    <li>这里是每一条内。。。。。</li>
    <li>这里是每一条内。。。。。</li>
    <li>这里是每一条内。。。。。</li>
    <li>这里是每一条内。。。。。</li>
    <li>这里是每一条内。。。。。</li>
    <li>这里是每一条内。。。。。</li>
    -->
    </ul>
    </div>
    </body>
    </html>

  • 相关阅读:
    CF 980D Perfect Groups(数论)
    CF 983B XOR-pyramid(区间dp,异或)
    CF 984C Finite or not? (数论)
    CF 979D Kuro and GCD and XOR and SUM(异或 Trie)
    (可能)常用打比赛网站
    排序工作量之新任务(SHOI2001)
    【图楼】长期图楼~~不定期更新
    【题解】SHOI2014概率充电器
    【题解】NOIP2015推销员
    [NOI2015][bzoj4197] 寿司晚宴 [状压dp+质因数]
  • 原文地址:https://www.cnblogs.com/hnyei/p/2217205.html
Copyright © 2011-2022 走看看