如何在边框之间留出空间(underline
悬停效果)。并且线条的颜色应该是红色。
a {
text-decoration: none
}
li {
display: inline;
}
li:hover {
text-decoration: underline;
}
<li><a href="">
abc
</a></li>
<li><a href="">
def
</a></li>
<li><a href="">
ggg
</a></li>
<li><a href="">
hello
</a></li>
最佳答案
改用border-bottom
和padding
a {
text-decoration: none
}
li {
display: inline-block;
}
li:hover {
border-bottom: 1px solid red;
padding-bottom: 10px;
}
<li><a href="">
abc
</a>
</li>
<li><a href="">
def
</a>
</li>
<li><a href="">
ggg
</a>
</li>
<li><a href="">
hello
</a>
</li>
关于html - 对象之间的文本装饰空间,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37722854/