hncreate - 2015/6/15 16:50:59
/*banner全屏幻灯*/
#banner_slide{width:100%;position:relative;height:z;z-index:2;overflow:hidden;}
#banner_slide .panel{position:absolute;clear:both;z-index:3;left:50%;bottom:20px}
#banner_slide .panel span{display:block;float:left;width:12px;height:12px;border-radius:6px;background-color:#999;margin-right:8px;cursor:pointer;filter:alpha(opacity=50);-moz-opacity:0.5;-khtml-opacity: 0.5;opacity:0.5;}
#banner_slide .panel span.current{background-color:#333;}
#banner_slide_inner{width:100%;height:366px;margin:0px auto;position:relative;left:0px;top:0px;overflow:hidden}
#banner_slide_inner li{position:absolute;width:100%;height:366px;z-index:1;left:0px;top:0px;background-repeat:no-repeat;background-position:center top;}
#banner_slide_inner li.zy_move{position:static;float:left;width:1440px;} /*左右滚动css*/
#banner_slide_inner li.sx_move{position:static;} /*上下滚动css*/
#banner_slide_inner li.current{z-index:2;}
#banner_slide_inner li a{display:block;width:100%;height:100%}
上面是幻灯的CSS 下面是后台首页栏目的调用
<div id="banner_slide">
<ul id="banner_slide_inner">
<li style="background-image:url(/e/images/banner/b_1.jpg)" class="current"/><a href=#></a></li>
<li style="background-image:url(/e/images/banner/b_2.jpg)"><a href=#1></a></li>
<li style="background-image:url(/e/images/banner/b_3.jpg)"><a href=#2></a></li>
<li style="background-image:url(/e/images/banner/b_4.jpg)"><a href=#3></a></li>
</ul>
</div>
系统是V3的宽屏版 这样在不同分辨率下 图片显示的不完全 要么2边有空白 要么2边显示不完全 求帮助解决下 谢谢!
scstjcy - 2015/6/15 17:14:47
鱼和熊掌往往不可能兼得。图片完全自适应也是不可能的,为了两边没有白边,图片宽度必须做得足够宽,一般要做到1920px以上,但是图片不管有多宽,其核心显示区域还是在1000px左右,这样就不会导致内容显示不全了。也就是说,除了中间1000px外,两边的图案都是陪衬,在低分辨率下可以不显示。
yangzhengang - 2015/6/16 15:29:28
顶,做成1920的,主要东西放在中间1400左右。