如何解决图像的水平滚动页面,无边框/填充,垂直居中!可能?
| 我看过许多垂直方向水平滚动和居中内容的示例,但没有结合使用-这似乎带来了真正的挑战! (还有头疼!) 我在这里-页面滚动良好,但内容未垂直居中,并且图像周围有间距(由空白引起:nowrap; ??)<style type=\"text/css\">
body{
background:#272727;
}
.wrapper {
display: table;
table-layout: fixed;
width: 100%;
height: 100%;
overflow: auto;
}
.container {
display: table-cell;
vertical-align: middle;
}
.content {
float:left;
white-space: nowrap;
padding:0;
margin:0;
}
img {
display:inline;
border:none;
padding:0;
margin:0;
}
</style>
解决方法
<script type=\"text/javascript\" src=\"http://code.jquery.com/jquery-1.5.2.min.js\"></script>
<script>
$(document).ready(function(){
var screenHeight = $(document).height();
var contentHeight = 733;
var difference = (screenHeight - contentHeight)/2;
alert(difference);
$(\'.content\').css({\'margin-top\': difference});
});
</script>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。