css - CSS 中的伪类和类

标签 css html class pseudo-class

我是 CSS 的新手。 关于伪类,我做错了什么,因为我的代码不起作用。

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
ul.navigationbar {
list-style-type: none;
margin: 0px;
padding: 0px;
overflow: hidden;
}

li.navigationbar {
float: left;
padding: 10px;
}

a.navigationbar:link, a.navigationbar:visited {
display: block;
        width: 120px;
        font-weight: bold;
        color: #FFFFFF;
        background-color: #98bf21;
        text-align: center;
        padding: 4px;
        text-decoration: none;
text-transform: uppercase;
}

a.navigationbar:hover, a.navigationbar:active {
background-color: #7A991A;
}</style>
</head>
<body>
<ul class="navigationbar">
<li class="navigationbar" role="presentation"><a href="#">Inicio</a></li>
<li class="navigationbar" role="presentation"><a href="#">Proveedores</a></li>
<li class="navigationbar" role="presentation"><a href="#">Artículos</a></li>
<li class="navigationbar" role="presentation"><a href="#">Contacto</a></li>
</ul>
</body>
</html>

谁能告诉我我做错了什么?

谢谢。

最佳答案

应该是

 .navigationbar a:link {
/*some styles*/
}

 .navigationbar a:visited {
/*some styles*/
}

因为 a.navigationbar 的子元素

关于css - CSS 中的伪类和类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28290563/

相关文章:

html - CSS inline-block li 的文本太长会破坏列表项的对齐

html - 图片链接到另一张图片(图片库)

javascript - jQuery 动画屏幕使用 (x)%

包含所有非公共(public)类的 Java 文件,其中一个类具有 main 方法

c++ - 为什么我收到以下错误 : "returning reference to temporary [-Werror=return-local-addr]"

c++ - 除了定义变量的地方之外,如何在不调用 new 的情况下调用 C++ 构造函数?

javascript - 如何使用动态页面内容使元素静态化

html - 网页中的边距、填充和边框显示不正确

php - 选中 Blob Image 并将其用作背景

HTML/CSS - 刷新 Div 对齐?