Heim > Web-Frontend > HTML-Tutorial > 请教背景如何满屏_html/css_WEB-ITnose

请教背景如何满屏_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-24 11:50:27
Original
1096 Leute haben es durchsucht


请问背景怎么不能满屏呢?


回复讨论(解决方案)

html,body{height:100%;}

html,body{height:100%;}



div2000px高度后?请问背景怎么不能满屏呢?

样式设在div上

<style>div {background: -moz-linear-gradient(top, #F1F1F1, #BFF08E);background: -webkit-linear-gradient(top, #F1F1F1, #BFF08E);}body {background:none;}html,body{height:100%;margin:0;padding:0;} div{height:2000px;}</style><div>
Nach dem Login kopieren

楼上 大哥,我要的是网页的背景全屏……

<style>body {background: -moz-linear-gradient(top, #F1F1F1, #BFF08E);background: -webkit-linear-gradient(top, #F1F1F1, #BFF08E);}html,body{margin:0;padding:0;} div{height:10000px;}</style><div/>
Nach dem Login kopieren


唉,看来没办法全部兼容了,页面小的就用
html,body{height:100%;margin:0;padding:0;} 
页面高的就不要100%了
是不是只能这样子了

html{
height:100%;
}
不行吗?

个人觉得单纯用CSS的话比较麻烦,因为每台电脑的长宽分辨率都不同……我自己做的网站是用JQUERY配合JQUERY.aeImageResize实现的:
html:

///外部必须包含DIV,而且DIV属性必须设置为overflow:hidden
请教背景如何满屏_html/css_WEB-ITnose///h为图片实际宽度,w为图片实际长度


jquery:
function bgResize(id, w, h) {
    var img_w = $(id).attr("w");
    var img_h = $(id).attr("h");
    var w_scale = w / img_w;
    var h_scale = h / img_h;
    if (h_scale * img_w          h_scale = 0;
    }
    else if (w_scale * img_h          w_scale = 0;
    }
    if (w_scale > h_scale) {
        $(id).aeImageResize({ height: 0, width: w });
    }
    else {
        $(id).aeImageResize({ height: h, width: 0 });
    }
}

id是img的名字,如果CLASS=123就填.class,如果ID是234就填#234,w是你希望图片缩放成长度的大小,H是你希望图片缩放成宽度的大小。然后在$(document).ready里面使用bgResize即可。

背景的样式定义放在body里面
默认意义上的背景层是 body

html,body{height:100%;}
body {
background: -moz-linear-gradient(top, #F1F1F1, #BFF08E);
background: -webkit-linear-gradient(top, #F1F1F1, #BFF08E);
}

应该不会有人告诉你在  html标签里面画背景把


唉没用,遇到有滚动条的就下半身没铺满了……
分给你们了,结帖先……


唉没用,遇到有滚动条的就下半身没铺满了……
分给你们了,结帖先……
body {
    height:auto;
    min-height:100%
}
再加这个看看
Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage