牛刀小试（一）：垂直菜单
2016-04-16 20:20
267 查看
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>垂直菜单</title>
<style type="text/css">
*{margin: 0;padding: 0;font-size: 15px}
ul{
list-style: none;
width: 100px;
}
a{
text-decoration: none;
display: block;
background-color: #201717;
color: red;
width:100px;
height: 30px;
line-height: 30px;
text-indent: 20px;
}
a:hover{background-color:#EC9A1B; color: #fff;}
</style>
</head>
<body>
<ul>
<li >
<a href="#">首页</a>
</li>
<li >
<a href="#">课程</a>
</li>
<li >
<a href="#">计划</a>
</li>
<li >
<a href="#">文章</a>
</li>
<li >
<a href="#">关于</a>
</li>
</ul>
</body>
</html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>垂直菜单</title>
<style type="text/css">
*{margin: 0;padding: 0;font-size: 15px}
ul{
list-style: none;
width: 100px;
}
a{
text-decoration: none;
display: block;
background-color: #201717;
color: red;
width:100px;
height: 30px;
line-height: 30px;
text-indent: 20px;
}
a:hover{background-color:#EC9A1B; color: #fff;}
</style>
</head>
<body>
<ul>
<li >
<a href="#">首页</a>
</li>
<li >
<a href="#">课程</a>
</li>
<li >
<a href="#">计划</a>
</li>
<li >
<a href="#">文章</a>
</li>
<li >
<a href="#">关于</a>
</li>
</ul>
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- NFA
- [网络编程]——网络编程_TCP_Socket通信
- leetcode 102.Binary Tree Level Order Traversal-数的层次遍历|递归|非递归实现
- 机器学习【machine learning】学习笔记【1】
- ubuntu系统qt中播放音频和视频遇到的问题及解决方法
- NOIP2008普及组传球游戏（动态规划）——yhx
- Match the string--hdu1797(模拟)
- java 版的复利计算器(张俊毅 周修文)
- UVa 1590 IP Networks
- Web工程目录和tomcat目录
- ajaxSubmit() 上传文件和进度条显示
- C++之类的六个默认成员函数
- 快速幂 快速乘法
- oil deposits——广搜
- acm 算法竞赛 时间
- 配置nodejs环境
- poj 1236
- javascript getElementById 使用方法及用法
- SQL Server 存储过程
- Delegate in UnrealEngine ——虚幻四中的委托