5个回答
展开全部
建一个div容器，用div包裹img，即可。
<div style="width:100%; overflow:hidden; height:auto; text-align:center;">
<img src="abc.png" />
</div>
或者将图片当作背景来使用（需要固定容器高度）：
<div style="width:100%; overflow:hidden; height:200px; background:url(abc.png) no-repeat center top;"></div>
当然，也可以使用Js来处理，不过不建议使用Js作过多网页版式设置。
<div style="width:100%; overflow:hidden; height:auto; text-align:center;">
<img src="abc.png" />
</div>
或者将图片当作背景来使用（需要固定容器高度）：
<div style="width:100%; overflow:hidden; height:200px; background:url(abc.png) no-repeat center top;"></div>
当然，也可以使用Js来处理，不过不建议使用Js作过多网页版式设置。
追问
嗯，我想用ul包含多个li图左浮动，来做滚动图。还要满足上面的要求，愁死了。
追答
其实没必要用ul/li来设置的，直接全部用div/span就可以了，现在浏览器对这些标签的限制少很多了。
并且如果使用Js来实现左右滑动，就应该使用Js来设置容器宽度，li全部浮动，用style.transform位移。下面这个是单独通过CSS样式实现的。
.container {width:100%; overflow:hidden;}
.ul {list-style:none; height:auto; margin:0px; padding:0px; overflow:hidden;}
.ul li {display:block; float:left; margin:0px; width:1000px; overflow:hidden; padding:0px;}
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
只对这张图生效，只用css是没办法实现的啦，css隐藏横向滚动是全局的，写在body上对整个可视区生效，没办法只对这个图生效。
你需要js或后台程序判断，当出现这个图时给body添加一个css属性：overflow-x:hidden;
你需要js或后台程序判断，当出现这个图时给body添加一个css属性：overflow-x:hidden;
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>demo</title>
<style type="text/css">
@charset "utf-8";
/* Default global style hyperlink style , time : 12/12/2014 */
a{color:#333333; text-decoration:none; outline:none;}
a:hover{color:#80b50a; text-decoration:none;}
/* main style */
*{font-family:"微软雅黑", Arial}
body{height:100%; min-height:100px; _height:100%;}
body,div,span,form,img,ul,ol,li,dl,dt,dd{margin:0px; padding:0px; font-size:12px; border:none;}
ul,h1,h2,h3,h4,h5,p{padding:0; margin:0; list-style-type:none; font-weight:normal;}
h2{color:#006ed3;}
h3{font-size:24px;}
h4{font-size:14px; font-weight:bold;}
ul,li,dl,strong{list-style-type:none;}
button,textarea,select{font:100% "微软雅黑", Arial; border:none;}
.clear{height:0; line-height:0; font-size:0; clear:both;}
/*demo css*/
.demo_div{margin:100px auto 0px; width:800px; height:450px; background:#99cc33; overflow:hidden; position:relative;}
.one{width:800px; height:400px; position:absolute; top:0px; left:0px; z-index:1;}
.one .win1{width:800px; height:400px; position:absolute; top:0px; z-index:1; display:none;}
.one .text{width:200px; height:50px; position:absolute; bottom:-50px; background:#cccccc; text-align:center; line-height:50px;}
.one:hover .win1{display:block;}
.two{width:800px; height:400px; position:absolute; top:0px; left:0px; z-index:2;}
.two .win2{width:800px; height:400px; position:absolute; top:0px; z-index:2; display:none;}
.two .text{width:200px; height:50px; position:absolute; bottom:-50px; left:200px; background:#dddddd; text-align:center; line-height:50px;}
.two:hover .win2{display:block;}
</style>
</head>
<body>
<div class="demo_div">
<div class="one">
<div class="win1" style="background:#0000ff;">11</div>
<div class="text">Slide_01</div>
</div>
<div class="two">
<div class="win2" style="background:#666666;">22</div>
<div class="text">Slide_02</div>
</div>
</div>
</body>
</html>
你看看是不是你要的那种效果，手动鼠标hover后会更换，你要滚动图片的时候，在div里面用背景来显示就可以 background:url(xxx.jpg) no-repeat center top ;
没有JS的话好像做不了定时器之类的功能哦，除非你用css3，就可以实现这个功能，你可以参考这个：http://demo.jb51.net/js/2013/CSS3pichdtab/
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
img外侧包裹一层div，将div设置width:100%;height:auto;overflow:hidden;text-align:center这样应该就可以了。但是前提是这个div要直接在body下面。div也就是屏幕宽度，超出了图片隐藏
追问
谢谢，但是我用一个层把网页宽度设定为1000px了。怎么办呢？
追答
如果是按照楼主的要求，最外层就不要包裹一层div了，如果包裹了实现不了滚动条了
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
把这个图片做成背景
追问
这个我试过，我还得让好几个图片左浮动做滚动图。
追答
那只好把你的滚动图改种表现方式了
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（3）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
