-
分类导航菜单的制作(附源码)--HTML
不多说,直接贴代码哈!有疑问,可追加评论哈!
demo.html:
<!DOCTYPE html>
<html>
<head>
<title>分类导航菜单</title>
<meta charset="utf-8">
<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">
<link href="css/demo.css" rel="stylesheet" text="text/css"/>
</head>
<body>
<nav>
<ul>
<li></li>
<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>
<li><a href="#">商务合作</a></li>
<li><a href="#">教育培训</a></li>
<li><a href="#">创业专区</a></li>
</ul>
</nav>
</body>
</html>
demo.css:
@CHARSET "UTF-8";
*{padding:0;margin:0;}
nav{border:1px solid #BCFF1D;font-size:12px;background:#D6FF8C url(../images/background.gif)
no-repeat top left;float:left;height:128px;}
nav ul{list-style:none;312px;margin:2px;}
nav ul li{104px;float:left;height:45px;text-align:center;line-height:35px;}
nav ul li a{background:url(../images/menu.gif) no-repeat;display:block;text-decoration:none;color:black;padding-left:18px;}
nav ul li a:hover,nav ul li a:active{background-position:0px -55px;color:#ff3300;font-weight:bold;}
Effect picture:
-
相关阅读:
java 整合redis缓存 SSM 后台框架 rest接口 shiro druid maven bootstrap html5
《将博客搬至CSDN》
前后端分离-定义响应格式化数据
微服务-Springboot+Redis缓存管理接口代码实现
java语法
java后台树形结构展示---懒加载
后端处理前端传过来的日期的两种方式
汉字转拼音工具类
Mybatis的小技巧
调用高德API,通过输入的地址,如省份、市、区获取经纬度 ,通过输入的经纬度,获取区域详情
-
原文地址:https://www.cnblogs.com/qikeyishu/p/7666008.html
Copyright © 2020-2023
润新知