用html和css做静态侧边栏 被访问过的a标签背景色为8e8e8e
时间: 2024-09-09 19:14:03 浏览: 30
要实现一个HTML和CSS的静态侧边栏,其中被访问过的`<a>`标签背景色变为8e8e8e,你可以这样做:
1. 首先,创建HTML结构,包括一个侧边栏导航区域(`.nav`)和一些链接`<a>`元素:
```html
<body>
<div class="nav">
<a href="#">链接1</a>
<a href="#">链接2</a>
<a href="#">链接3</a>
</div>
</body>
```
2. 使用CSS来设置基本样式,包括侧边栏的粘性定位以及访问过的链接样式。这里我们使用`:visited`伪类来改变被访问过的链接颜色:
```css
.nav {
position: sticky;
top: 0;
width: 800px;
height: 50px;
background-color: rgb(0, 174, 255);
margin: 100px auto;
font-size: 30px;
color: white;
}
a:link {
display: inline-block;
padding: 10px;
text-decoration: none;
}
a:visited {
background-color: 8e8e8e; /* 修改为访问过的链接颜色 */
color: white;
}
```
在上述CSS中,`:link`表示未被访问的链接,`:visited`表示已经被访问过的链接。