我想使用 css 使图像保持其纵横比 (16:9) 并同时响应。
此图像将始终位于屏幕中央。检查架构以帮助您。
我找到了 this发布,我尝试了 Chris 的解决方案和 Isaac 的解决方案。但是我无法将图像带到中心。我试过像这样使用 Bootstrap。
<div class="col-md-4">.col-md-4</div>
<div class="wrapper col-md-4">
<div class="main">
This is your div with the specified aspect ratio.
</div>
</div>
<div class="col-md-4">.col-md-4</div>
或
<body>
<div class="col-md-4" id="wrap1">.col-md-4</div>
<div class="col-md-4" id="aspectRatio">Aspect Ratio?</div>
<div class="col-md-4" id="wrap2">.col-md-4</div>
</body>
但是所有的 div 都出现在另一个下面。
关于如何使用 Bootstrap 将 div 置于中心有什么想法吗?
最佳答案
我总是将我的 img 放在一个 div 中,并将 div 居中:
margin:0 auto;
对于响应式图像,定义宽度并使高度自动。 希望对您有所帮助。
关于html - 响应图像保持宽高比并始终位于中心,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36143093/