导航条 HTML CSS_php.cn手记

abstract： <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>导航条</title> <meta name="viewport" content=&quo

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>导航条</title>
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<style <style type="text/css">
			*{
				padding:0;
				margin:0;
			}
			.shape{
				margin:20px auto;
				width:1000px;
				height:40px;
				background-color:#6495ED;
				list-style:none;
			}
			.shape li{
				width:25%;
				text-align:center;
				padding-top:8px;
				padding-bottom:8px;
				float:left;
			}
			.shape li a{
				font-size:18px;
				display:block;
				width:100%;
				text-decoration:none;
				color:white;
				font-weight:bold;
			}
			.shape li:hover{
				background-color:#c00;
			}
		</style>
	</head>
	<body>
		<ul class="shape">
			<li><a href="#">首页</a></li>
			<li><a href="#">新闻</a></li>
			<li><a href="#">联系</a></li>			
			<li><a href="#">关于</a></li>
		</ul>
	</body>
</HTML>

Correcting teacher：天蓬老师Correction time：2019-06-13 17:03:27
Teacher's summary：这个简单的导航, 其实内部有很多知识点的, 多做几次

导航条 HTML CSS

Popular Entries