如何相对于浏览器大小以增量调整元素的大小？

Question

我正在尝试在浏览器大小更改时进行DIV宽度更改。

不是可以用百分比处理的某种比例，但仍然具有屏幕尺寸的依赖性。 我试图将浏览器宽度的最大值设为80％，并将其除以20。 如果屏幕是1000px宽，那么div将是800px，如果屏幕是1024px，那么它仍然是800px（因为1024的80％是819.2，不是除以20）。

除了进行大量媒体查询外，我不知道如何做到这一点。

Answer 1

这应该有希望让你继续前进。它使用jQuery以20px的增量调整div的大小。它并不完美，但它是一个开始。

http://jsfiddle.net/ydtdS/3/

 function tale(div,w) {
 if(w%20==0) {
    $(div).text(w);
    $(div).css("width",w);
 } else {
    w = Math.floor(w / 20)*20;
    $(div).text(w);
    $(div).css("width",w);
 }
}
$(window).resize(function() {
    var windowWidth = $(window).width();
    tale(".twenty",windowWidth); 
});

tale(".twenty",$(window).width());