我正在制作一面视频墙,尽管指定了0边距和填充样式,但它会以正确的边距显示。这是我的代码:
<html>
<head>
<style>
html,body{margin:0; padding:0;}
</style>
</head>
<body>
<iframe width="473" height="353" src="https://www.youtube.com/embed/PC3o2KgQstA? modestbranding=0&showinfo=0&controls=0&autoplay=1&loop=1&playlist=PC3o2KgQstA"></iframe>
<iframe width="473" height="353" src="https://www.youtube.com/embed/f4G68civvo8?modestbranding=0&showinfo=0&controls=0&autoplay=1&loop=1&playlist=f4G68civvo8"></iframe>
<iframe width="473" height="353" src="https://www.youtube.com/embed/8UHupHDwJJQ?modestbranding=0&showinfo=0&controls=0&autoplay=1&loop=1&playlist=8UHupHDwJJQ"></iframe>
<iframe width="473" height="353" src="https://www.youtube.com/embed/q0S642NtHtE?modestbranding=0&showinfo=0&controls=0&autoplay=1&loop=1&playlist=q0S642NtHtE"></iframe>
<iframe width="473" height="353" src="https://www.youtube.com/embed/MTY1Kje0yLg?modestbranding=0&showinfo=0&controls=0&autoplay=1&loop=1&playlist=MTY1Kje0yLg"></iframe>
<iframe width="473" height="353" src="https://www.youtube.com/embed/8tnDzdQDtLY?modestbranding=0&showinfo=0&controls=0&autoplay=1&loop=1&playlist=8tnDzdQDtLY"></iframe>
<iframe width="473" height="353" src="https://www.youtube.com/embed/ntQ7qGilqZE?modestbranding=0&showinfo=0&controls=0&autoplay=1&loop=1&playlist=ntQ7qGilqZE"></iframe>
<iframe width="473" height="353" src="https://www.youtube.com/embed/kxX1MMN1n-Y?modestbranding=0&showinfo=0&controls=0&autoplay=1&loop=1&playlist=kxX1MMN1n-Y"></iframe>
<iframe width="473" height="353" src="https://www.youtube.com/embed/yC8O5HPvfsg?modestbranding=0&showinfo=0&controls=0&autoplay=1&loop=1&playlist=yC8O5HPvfsg"></iframe>
<iframe width="473" height="353" src="https://www.youtube.com/embed/4oQ2wo1YU0o?modestbranding=0&showinfo=0&controls=0&autoplay=1&loop=1&playlist=4oQ2wo1YU0o"></iframe>
<iframe width="473" height="353" src="https://www.youtube.com/embed/uAstltdJkXI?modestbranding=0&showinfo=0&controls=0&autoplay=1&loop=1&playlist=uAstltdJkXI"></iframe>
<iframe width="473" height="353" src="https://www.youtube.com/embed/Bqha8360_8M?modestbranding=0&showinfo=0&controls=0&autoplay=1&loop=1&playlist=Bqha8360_8M"></iframe>
</body>
</html>
答案 0 :(得分:1)
<强>小提琴强>
http://jsfiddle.net/sda64sw2/1/
添加了100% width
和text-align:center
;
html,body{
margin:0 auto;
width:100%;
text-align:center;
}