CSS最大最小宽高兼容

利用css表达式和三目运算*没有特别需要,坚决不用css表达式!

01.高度固定设置最大宽度

.maxWidth{
    max-width: 200px;
    height: 60px;
    overflow: auto;
    _width:expression(document.body.clientWidth > 150 ? "150px" : "auto");
    /*_width:expression(document.body.clientWidth < 150 ? "150px" : "auto");*//*最小高度*/
}

02.宽度固定设置最小高度

.minHeight{
    max-height: 80px;
    width: 200px;
    overflow: auto;
    /*_height:expression(this.scrollHeight > 80 ? "80px" : "auto");*//*最大高度*/
    _height:expression(this.scrollHeight < 80 ? "80px" : "auto");
}

03.同时设置最大宽度和最小宽度

.min_and_max_width{
    min-width:100px;
    max-width:150px;
    height: 100px;
    overflow: auto;
    _width: expression(
        document.body.clientWidth < 100 ? "100px" :
        ( document.body.clientWidth > 150 ? "150px" : "auto")
    );
    /*_height: expression(
        this.scrollHeight < 200 ? "200px" :
        ( this.scrollHeight > 400 ? "400px" : "auto")
    );*//*同时设置最大高度和最小高度*/
}

 

posted @ 2014-04-17 14:05  白小虫  阅读(590)  评论(0编辑  收藏  举报