我正在使用 cssgrid.net,它是一个 12col 1140px 响应式流体框架,但我在居中时遇到了问题。
我的网站有一个“background-size: cover;”图片,我有一个 Logo ,我想在浏览器中水平居中,即使它正在调整大小时也是如此。
这是我的 HTML:
<div class="container">
<div class="row">
<div class="fourcol"></div>
<div class="fourcol">
<div class="logo"></div>
</div>
<div class="fourcol last"></div>
</div>
还有 CSS:
.logo {
background: url(../images/logo_retina.png) no-repeat;
background-size: 175px 175px;
}
这是我网站顶部的样子:
Logo 从第二组 4 列开始,但我如何使其在这组 4 列中居中,即使在调整大小时也是如此?
请记住编码只是一种爱好。
最佳答案
假设每个 div.fourcol
具有相同的固定宽度我认为 background: url(../images/logo_retina.png) no-repeat center middle;
应该有帮助。如果它们在宽度设置为 auto 的情况下彼此 float ,则会出现问题,因为 div.row
可能比 div.fourcol
的累积宽度更宽。
关于html - 如何在 1140 像素的流体响应框架中将 div 居中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13636695/