gpt4 book ai didi

css - 在文本链接旁边的背景图像链接下填充 - 为什么?

转载 作者:太空宇宙 更新时间:2023-11-04 05:30:54 24 4
gpt4 key购买 nike

这个 CSS 问题让我很烦 :-(

我无法删除此页面中链接下的填充 http://www.yart.com.au/stackoverflow/test2.htm

我已将问题减少到最低限度,因此非常清楚。

你可以在这里看到我的问题http://www.yart.com.au/stackoverflow/blue.png alt text http://www.yart.com.au/stackoverflow/blue.png

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>

<style type="text/css">

*
{
padding:0;
margin:0;
font:15px arial;
}

div
{
display:inline;
height:18px;
line-height:18px;
background-color :blue;
}

.PageMove
{
display:inline-block;
background-image: url(http://www.yart.com.au/stackoverflow/page_move.gif);
background-repeat:no-repeat;
width:18px;
height:18px;
line-height:18px;
}


.Text
{
background-color :red;
display:inline;
height:18px;
line-height:18px;
}


</style>
</head>


<body>

<div><a href="#" class="PageMove"></a><a href="#" class="Text">18 pixels high</a></div>

</body>

</html>

最佳答案

display: inline-block 的内容被视为字符并位于基线上。下部有空间(您可以在 p、j、g 和 q 等字母上找到)。

设置 vertical-align: bottom 将元素定位在底部而不是基线。

关于css - 在文本链接旁边的背景图像链接下填充 - 为什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3228434/

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