我很讨厌 CSS 样式。我试图在此处对齐这些 Logo :
<a href="https://geo.music.apple.com/us/album/_/1460176267?mt=1&app=music&at=1000lHKX">
<img id="apple" src={apple}></img>
</a>
<a href="https://open.spotify.com/album/6ITBoE1l1zPCtXKOTN12IC">
<img id="spotify" src={spotify}></img>
</a>
<a href="https://www.pandora.com/artist/various-artists/love-hart-presents-hartfm-explicit/AL2V7Pb7xcg7p74">
<img id="pandora" src={pandora}></img>
</a>
<a href="https://listen.tidal.com/album/107846023">
<img id="tidal" src={tidal}></img>
</a>
在我页面的其他地方(它们位于左上角),但是当我尝试这样应用 CSS 规则时:
#apple {
top: 75%;
left: 34.5%;
width: 4%;
height: 4%;
}
#spotify {
width: 3.5%;
height: 3.5%;
}
#pandora {
top: 10px;
left: 10px;
width: 6%;
height: 8%;
}
#tidal {
width: 4%;
height: 4%;
}
它们实际上并没有移动。不知道在这里做什么。
最佳答案
我将您所有的 a 标签包装在一个 div 中,并给它一个 id="parent",这些每个标签似乎都可以做您可能想要的事情?
不过不确定您究竟希望“对齐”什么或如何“对齐”,所以我在下面提供了一些选项。希望其中之一是您正在寻找的,您不需要顶部、左侧等,只需使用宽度和高度属性来调整 a 标签的大小。
#parent {
display: flex;
flex-direction: column;
}
#parent {
display: grid;
justify-content: center;
}
#parent {
display: flex;
justify-content: center;
}
关于html - CSS 样式以便按照我希望它们在我的页面上的方式正确对齐 img?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57565855/