gpt4 book ai didi

javascript - 如何让带有图像的 HTML 按钮与文本按钮对齐?

转载 作者:行者123 更新时间:2023-11-30 08:50:06 25 4
gpt4 key购买 nike

我想并排放置两个按钮,一个带有图像,一个带有文本。

我不明白为什么他们没有在基线上正确对齐。

Offset buttons

代码如下:

<head>
<style type="text/css">
button {
height: 20px;
}
</style>
</head>
<body>
<button id="image-button">Some text
<img src="http://www.famfamfam.com/lab/icons/mini/icons/application_firefox.gif">
</button>
<button id="text-button">Some text</button>
</body>

我很想找到解决方案,但我也很想了解这种行为的“原因”,因为它在所有浏览器上都是一致的。

另外,我试过在图像上使用“float: left”,但这在 Chrome 上不起作用。

最佳答案

添加vertical-align: top

button {
height: 20px;
vertical-align: top
}

检查这个JSFiddle

关于javascript - 如何让带有图像的 HTML 按钮与文本按钮对齐?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18641687/

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