<html>
<head>
<meta charest="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<style>
a {
width: 400px;
height: 120px;
}
.one:link{
background-color: red;
}
.one:visited{
background-color: yellow;
}
.one:hover {
background-color: green;
}
.two:link{
background-color: blue;
}
.two:visited{
background-color: pink;
}
.two:hover {
background-color: purple;
}
.three:link{
background-color: skyblue;
}
.three:visited{
background-color: gold;
}
.three:hover {
background-color: tomato;
}
.four:link{
background-color: indigo;
}
.four:visited{
background-color: aqua;
}
.four:hover {
background-color: chartreuse;
}
.fire:link{
background-color: blue;
}
.fire:visited{
background-color: rebeccapurple;
}
.fire:hover {
background-color: yellow;
}
</style>
</head>
<body>
<a href="#" class="one">五彩导航</a>
<a href="#" class="two">五彩导航</a>
<a href="#" class="three">五彩导航</a>
<a href="#" class="four">五彩导航</a>
<a href="#" class="fire">五彩导航</a>
</body>
</html>
web前端 五彩导航作业
最新推荐文章于 2024-09-04 20:18:34 发布