最简单导航栏 html css

dhl.html


html>
<html>
    <head>
        <meta charset="utf-8">
        <title>导航栏title>
        <link type="text/css" rel="stylesheet" href="css/dhl.css">
    head>
    <div class="dhl">
        <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>
    div>
html>

dhl.css


.dhl ul
{
	margin-bottom: 30px;
	padding: 0px;
	width: 600px;
	height: 30px;
}
.dhl ul li
{
	height: 30px;
	width: 16.45%;
	list-style: none;
	float: left;
	display: block;
	font: "微软雅黑";
}
 
.dhl ul li a
{
	text-align: center;
	color: black;
	font-size: larger;
	text-decoration: none;
	background-color: white;
	line-height: 40px;
}
.dhl ul a:hover
{
	color: rgb(0,0,0);
	background-color: #00FFFF;
}

运行后

划过导航栏背景变色

相关阅读:
springboot+蛋糕订购商城毕业设计-附源码161617
【Spring连载】使用Spring Data访问 MongoDB（十）----分片Sharding
基于go语言gin框架的web项目骨架
SAP官方免费提供的OData Gateway Demo 学习系统
药物化合物信息查询系统（精选常用的5个）
以JSP为视图解析器搭建SSM项目
计算机网络—交换机综合实验
BootLoader为什么要分阶段？
天堂2游戏出错如何解决
【QT】Dialog对话框

原文地址：https://blog.csdn.net/m0_70215122/article/details/136384081

最简单 导航栏 html css

最简单导航栏 html css