Explorer6 下的 max-height 属性

作者：手气不错 发布时间：August 30, 2008 分类：CSS

今天有用户报告，说打开我们的页面会导致浏览器崩溃。查了下，原来是这句 CSS 导致了性能的问题

_height: expression(this.scrollHeight > 200 ? 200 + 'px' : 'auto');

看来还是 Exploer 的 CSS expression 作祟。简单的说明下这个语句，主要是实现 Exploer6 不支持的 max-height 属性而做的个 Hack（是个“历史遗留问题”）。

期前对于 CSS expression 也做过类似的测试，使用程度为--慎用--禁用（原因有三，仅 Exploer 支持、性能消耗很大、脚本和表现混杂）。

这一 Hack 姑且可以被认定为，是在 Exploer6 走向末路之前的“救命稻草”（但目前在日常的项目中，如果出现这样的代码，是无论如何都不会被允许的）。

最后，简单的写了个 DEMO，以及更多的信息可以查看这里。

注： Exploer7 已经支持 max-height 等属性。

已有 7 条回复

  1. 锐风 August 30th, 2008 at 08:01 am #1
    锐风

    so fast ..

  2. 锐风 August 30th, 2008 at 08:02 am #2
    锐风

    有一个让我们 BS IE6 的理由.

  3. robbenmu August 31st, 2008 at 06:19 am #3
    robbenmu

    _height: expression(this.scrollHeight > 201 ? 200 + 'px' : 'auto');

    搞成这样就行了，不会挂了

  4. 大猫 September 1st, 2008 at 08:51 am #4
    大猫

    是不是..用CSS expression,每次鼠标移动页面滚动之类的都会重新触发...

  5. SimonCHEN November 2nd, 2008 at 06:16 am #5
    SimonCHEN

    最近开始学习CSS，得到一个奇怪的东西google半天都找不到答案，想起经常在这里看到你有发表CSS文章，所以就跑来这里问问题了，希望能在这里得到答案 :）



    代码如下，body中的width当设置为95%或者980px以上时就不能居中，不知道是何道理？或者是我显示器问题？



    <!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>



    <style type="text/css">

    <!--

    body{

    margin:20px auto;

    padding:0;

    width:95%;

    }

    #header {

    background: url(images/header_bg.jpg) no-repeat;

    height:272px;

    }

    #header2 {

    height:145px;

    background: url(images/header_bg1.jpg) no-repeat;

    }

    #title {

    height:60px;

    background: url(images/title.png) no-repeat;

    }

    #content {

    height:50px;

    background: url(images/contentmain_bg.jpg) no-repeat;

    }

    -->

    </style>





    </head>



    <body >



    <div id="header"></div>

    <div id="header2"></div>

    <div id="title"></div>

    <div id="content"></div>



    </body>

    </html>

  6. SimonCHEN November 2nd, 2008 at 06:17 am #6
    SimonCHEN

    希望的是背景图片居中

  7. 手气不错 November 7th, 2008 at 09:40 pm #7
    手气不错

    @SimonCHEN 此类问题发邮件给我吧（突然忘记我没有限制留言长度），囧

Yahoo 统计