0

有没有办法只在（无）有序列表中的文本下划线？具体来说，比如说，我有一个菜单，内联显示，没有项目符号，其中每个项目都是一个链接。链接没有下划线，但是当用户将鼠标悬停在它们上面时，它们会被带下划线。然后他们用不可见的要点强调，这让我很烦恼。有没有办法只在文本下划线？

答案：原来，我的问题不在于子弹。此外，它是如此愚蠢，以至于我现在为这个问题感到羞耻。我以为我记得所有被编码的​​东西，但结果我&nbsp;出于某种奇怪的原因在列表项之前有一个。我保留了所有内容，但是将 :hover 从作用于<a>标签上更改为<span>带有“悬停”类的标签，该类包围了文本，而省略了&nbsp;. 现在一切都很好，我只得到了带下划线的文本。感谢@Ken Clark 指出<span>“技巧”。

4

5 回答 5

0

无法理解你到底在问什么。

如果您不希望项目符号出现在无序列表中

<ul type="none">  <u><li>one</li></u>  <u><li>two</li></u>  <u><li>three</li></u></ul>

将类型设置为 none 将删除项目符号。

<ul style="list-style-type:none">

以上将完美运行。因为 type:none 可能不会被所有浏览器接受。

于 2013-03-22T06:53:34.047 回答
0

将您的 ul 的列表样式设置为无：

ul { list-style: none }

悬停时的下划线不会在子弹过去的位置下划线。这是一个要演示的小提琴。

于 2013-03-22T06:54:35.683 回答
0

像这样？

jsFiddle

HTML

<ul>
    <li><a>Link</a></li>
    <li><a>Link</a></li>
    <li><a>Link</a></li>
</ul>

CSS

a {
    text-decoration:underline;
}

这只会在链接下划线，而不是项目符号。如果您只希望它在悬停时加下划线，则将 CSS 更改为：

a {
    text-decoration:none;
}
a:hover {
    text-underline;
}
于 2013-03-22T06:55:49.640 回答
0

从链接和内部删除下划线a:hover将您的文本放在一个跨度中并为该跨度赋予下划线样式：示例：

<style>
.anchor
{
    text-decoration:none;
}

.anchor:hover
{
    text-decoration:none;
}
.spnItem:hover
{

    text-decoration:underline;
}
</style>
<a href="#" class="anchor"><span class="spnItem">Item</span> </a>
于 2013-03-22T06:56:09.090 回答
0

这对你有用吗？

ul li
{
    list-style:none;
}


a:hover{
    text-decoration:underline;
    cursor:pointer;
}
<ul>
    <li><a>Link</a></li>
    <li><a>Link</a></li>
    <li><a>Link</a></li>
</ul>

于 2013-03-22T07:09:04.560 回答