我要自学网导航栏设计

2021-01-19 19:35:31 阅读：163 来源： 互联网

标签：40px color margin height 我要 ul nav 自学导航

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
	*{
		/*清除所有元素内外边距*/
		margin: 0;
		padding: 0;
	}
	nav ul{
		/*取消列表样式*/
		list-style: none;
		margin: 0 auto;
	}
	nav{
		/*设置导航栏*/
		width: 1000px;
		height: 40px;
		margin: 100px auto;
		padding: 0;
		background-color: #363636;
	}
	nav ul li{
		width: 100px;
		height: 40px;
		line-height: 40px;
		float: left;
		text-align: center;
		color: #ffffff;
		font-size: 14px;
	}
	nav ul li a:hover{
		/*用伪类选择器设置鼠标悬浮样式*/
		font-size: 16px;
		color: #00aeff;
	}
</style>
</head>
<body>
	<nav>
		<ul>
		<li><a>电脑办公</a></li>
		<li><a>平面设计</a></li>
		<li><a>室内设计</a></li>
		<li><a>室外设计</a></li>
		<li><a>影视动画</a></li>
		<li><a>机械设计</a></li>
		<li><a>程序设计</a></li>
		<li><a>工业自动</a></li>
		<li><a>网页设计</a></li>
		<li><a>会计课程</a></li>
		</ul>
	</nav>
	
</body>
</html>

标签：40px,color,margin,height,我要,ul,nav,自学,导航
来源： https://www.cnblogs.com/nanfengnan/p/14299580.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

我要自学网导航栏设计