html - li 菜单下划线样式不会消失

Question

我创建了一个带有 ul 和 li 标签的菜单，并尝试在所有 3 个部分中放入 css font-style:none，但仍然无法从菜单中删除下划线。

<div class=menu>
    <ul>
        <a href="http://www.bettyzhangart.com"><img id=smalllog src="http://images2.webydo.com/31/313624/3958%2f7f54386b-c039-47a9-b2f5-eda78fc87287.png"/></a>
        </li>
        <li><a href="http://bettyzhangart.com/about.html">BIO & CV</a></li>
        <li><a href="http://bettyzhangart.com/gallery.html">FINE ART</a></li>
        <li><a href="http://bettyzhangart.com/contact.html">GRAPHIC DESIGN</a></li>
        <li><a href="http://bettyzhangart.blogspot.ca/" /a>BLOG</li>
        <li><a href=""/a>CONTACT</li>
    </ul>
</div>

ul {
    list-style-type:none;
    margin:0;
    padding:0;
}
li {
    padding:50px 0px 30px 10px;
    display:inline;
    vertical-align: middle;
}
li a {
    padding: 0px 30px 0px 30px;
    text-align:center;
    font-family:'Quicksand', sans-serif;
    font-size: 16px;
    font-style: none;
    color: #8e8e8e;  
}

Answer 1

好的，既然评论有效，我会把它作为答案发布。要消除悬停时 anchor 标记的正常下划线，您可以应用:

a:hover{
    text-decoration:none;
}

这对你有用。由于 font-style 用于其他用途，如倾斜、正常等。