在引导中与DIV完全对齐和缩放图像
在引导中与DIV完全对齐和缩放图像
提问于 2020-04-18 07:52:38
我试图在引导Joomla模板的div中插入8个图像和一个按钮。我需要的图像是垂直对中和水平均匀地对齐在所有响应视图(移动，平板电脑，小型笔记本电脑，大屏幕与最大192 of的with)。这是我的考试网站：
webdisenjo.nl和徽标div是“模版logos_home”。
我在为图像应该是什么以及如何在div中放置它们而奋斗。
现在，我试过这门课了。
<div class="logo-inline-div"><img src="images/logo/Logo_3WO.png" /></div>
但效果不佳。
我也试过这门课
<div class="row"><div class="col-8"></div></div>
.col-8{width: 10%;}但这也是行不通的。
Stack Overflow用户
回答已采纳
发布于 2020-04-18 08:32:21
我已经清理了您的代码，并添加了类clients-section。
因此，只要在logos_home中添加下面的html，并使用这个css，它就会如下所示
<div class="custom logos_home">
<div class="row clients-section">
<div class=""><img src="/images/logo/Logo_3WO.png" alt="pubblikvos Logo_3WO"></div>
<div class=""><img src="/images/logo/Logo_ACP.png" alt="pubblikvos Logo_ACP"></div>
<div class=""><img src="/images/logo/Logo_Amvest.png" alt="pubblikvos Logo_Amvest"></div>
<div class=""><img src="/images/logo/Logo_CBRE.png" alt="pubblikvos Logo_CBRE.png"></div>
<div class=""><img src="/images/logo/Logo_Fine-Hotels-Suites.png" alt="pubblikvos Logo_Fine-Hotels-Suites"></div>
<div class=""><img src="/images/logo/Logo_Greystar.png" alt="pubblikvos Logo_Greystar"></div>
<div class=""><img src="/images/logo/Logo_MiCompany.png" alt="pubblikvos Logo_MiCompany"></div>
<div class=""><img src="/images/logo/logo_NS.png" alt="pubblikvos logo_NS"></div>
</div>
<div><a class="knop_alle-clienten" href="/nl/projecten">Alle clienten</a></div>
</div>
.clients-section {
display: flex;
align-items: center;
justify-content: space-between;
flex-direction: row;
}
.logos_home {
text-align: center;
}
a.knop_alle-clienten {
margin: 40px 0 0;
display: inline-block;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/61285872
复制相关文章
相似问题
腾讯云开发者
