0

如何在 CSS 中有下拉列表的链接旁边添加一个小箭头？

background: url('arrow.png') no-repeat 0 0;

当我使用它时，它会在每个链接的左侧添加一个箭头，但我只希望它出现在具有子菜单的链接上。

有什么帮助吗？

4

4 回答 4

1

用这个：

background: url('arrow.png') no-repeat right top / 70% 70%;

例如，70% 的百分比是背景尺寸的宽度和高度，根据您的需要进行更改。（因为您在原始问题中希望它更小）。

将此规则应用于将具有下拉列表的链接类。

于 2013-06-10T23:18:29.490 回答
0

http://www.w3schools.com/cssref/css3_pr_background.asp是任何类型的 CSS 语法问题的一个很好的参考。

您定义 CSS 规则的方式将箭头放在左上角。例如，要将其居中在右侧，请使用：

background: url('arrow.png') no-repeat right center;

如果你这样做，我还建议添加一个填充，以便背景图像不在文本后面：

padding-right: 15px;

为了使填充起作用，您需要覆盖从inlineto链接的显示inline-block：

display: inline-block;

要调整箭头的大小，您可以只使用较小的图像，也可以使用background-size属性，尽管使用后者会失去对 IE8 及更低版本的支持。

于 2013-06-10T23:15:02.233 回答
0

根据您得到的其他答案，您的问题看起来已经发生了很大变化......但要按原样回答，如果您只想在某些链接上使用它，您可以为这些链接添加一个额外的类，并且将您的背景图像添加到该类。

于 2013-06-10T23:17:52.347 回答
-1

尝试这个

background-position:right;
于 2013-06-10T23:14:47.210 回答