gpt4 book ai didi

html - 如何在 CSS 中正确对齐图片

转载 作者:太空宇宙 更新时间:2023-11-04 02:36:22 25 4
gpt4 key购买 nike

我有 3 个图标,我想将它们居中对齐 我尝试了不同的代码,但到目前为止没有任何效果,我尝试为其添加边距,但问题是它在它们之间添加了不必要的空间,所以我希望它们彼此靠近,有没有办法将 margin-right 放在它上面并从那里删除空间?我只想将它们对齐到我的段落下方,但在它的中心。
到目前为止,这是我的代码。

    #body a img {
width: 50px;
height: 50px;
margin-top: 50px;
margin-right: 200px;
}
<div id="body">
<p class="text">We are a group of friends that enjoy playing League Of Legends togather, feel free to follow us on our different website medias</p>
<div class="icons">
<a href="https://www.youtube.com/themunkiuke">
<img class="icon1" src="images/youtube.png">
</a>
<a href="http://www.twitch.tv/siminios">
<img class="icon2" src="images/twitch.png">
</a>
<a href="http://yinochi.deviantart.com/gallery/">
<img class="icon3" src="images/art.png">
</a>
</div>

最佳答案

会不会是一个简单的text-align缺失?

#body a img {
width: 50px;
height: 50px;
}
.icons {
text-align:center;
}
<div id="body">
<p class="text">We are a group of friends that enjoy playing League Of Legends togather, feel free to follow us on our different website medias</p>
<div class="icons">
<a href="https://www.youtube.com/themunkiuke">
<img class="icon1" src="images/youtube.png">
</a>
<a href="http://www.twitch.tv/siminios">
<img class="icon2" src="images/twitch.png">
</a>
<a href="http://yinochi.deviantart.com/gallery/">
<img class="icon3" src="images/art.png">
</a>
</div>

关于html - 如何在 CSS 中正确对齐图片,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35612162/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com