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>

  • 相关阅读:
    EasyBPM进销存之物料管理
    水厂流程三维场景可视化解决方案
    构造器
    可变形参
    重写
    拥塞处理(一)——拥塞处理的历史概述
    idea的各种乱码问题
    MySQL的主键也想使用uuid
    使用spring security明文密码校验时报错-BadCredentialsException: Bad credentials
    ValueError: check_hostname requires server_hostname
  • 原文地址:https://www.cnblogs.com/hnyei/p/2217205.html
Copyright © 2011-2022 走看看