› 珞 › 日志

珞

http://www.javakc.com

使用列表标签，制作一个导航目录

2022-08-12 10:53:05 查看(55) 回复(0)

效果如下：

学习交流
测试题
下载
考勤
SEO

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
li{
list-style: none;
display: inline-block;
background-color: cornflowerblue;
width: 120px;
height: 70px;
text-align: center;
line-height: 70px;
}
li:hover{
background-color: deepskyblue;
color: red;
cursor: pointer;
}
</style>
</head>
<body>
<ul>
<li>学习交流</li>
<li>测试题</li>
<li>下载</li>
<li>考勤</li>
<li>SEO</li>
</ul>
</body>