大图片随浏览器水平居中显示
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了大图片随浏览器水平居中显示相关的知识，希望对你有一定的参考价值。
css样式：
<style>
*{margin: 0; }
.ads-detail {
width: 1000px;
/*height: 1000px;*/
position: relative;
margin: 0 auto;
}
.ads-detail p{
position: absolute;
width:1920px;
left:-465px;
top:0px;
}
.ads-detail img {
display: block;
width: 100%;
}
</style>
js代码：
<script>
window.onload = function(){
//设置ads_detail高度
var arrP = document.getElementById("ads-detail").getElementsByTagName("p");
var adsHeight = 0;
for(var i = 0 ; i < arrP.length; i++){
adsHeight += arrP[i].clientHeight || arrP[i].offsetHeight;
}
document.getElementById("ads-detail").style.height = adsHeight + "px";
};
</script>
html结构：
<div style=" width: 100%; overflow: hidden;">
<div class="ads-detail" id="ads-detail">
<p>
<img src="0e7422be-e329-4eb9-a1a3-f85491c18d14.jpg">
</p>
</div>
</div>
以上是关于大图片随浏览器水平居中显示的主要内容，如果未能解决你的问题，请参考以下文章