移动屏幕的DIV布局

这个问题在这里已经有了答案:

  • 让div填充剩余屏幕空间的高度31个答案

  • 如果你只想通过CSS来完成,而没有JS,那么唯一已知的工作方法是为每个页面使用不同的样式表。 第1页可以使用page1.css,其中div的高度设置为xyz。 同样的页2,3,4 ...如果你有少量的页面,你可以做到这一点。

    否则,你需要依赖JQuery。 这是一个小小的窥视:

    $(function(){
        $(window).resize(function(){
            var h = $(window).height();
            var w = $(window).width();
    
            if( h > 1000){
                 $("#yourVaryingElement").css('height', '900px');
            }
            if( h > 700){
                 $("#yourVaryingElement").css('height', '600px');
            }
            if( h > 500){
                 $("#yourVaryingElement").css('height', '400px');
            }
            // and so on..
        });
    });
    

    请记住初始CSS样式之后运行此脚本。 无论谁(脚本,CSS或内联风格)最后设置大小都将成为赢家。

    链接地址: http://www.djcxy.com/p/88245.html

    上一篇: DIV Layout for Mobile screen

    下一篇: CSS layouting for web page?