526互联

html例子

发布时间 2023-11-10 09:57:24作者: 耿集

HTML部分

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
    <link rel="stylesheet" type="text/css" href="style.css"/>
    <title>文档</title>
</head>

<body>
<div id="menu">
    <ul>
        <li><a href="#">菜单项1</a></li><li><a href="#">菜单项2</a></li><li><a href="#">菜单项3</a></li><li><a href="#">菜单项4</a></li><li><a href="#">菜单项5</a></li><li class="last"><a href="#">菜单项6</a></li>
    </ul>
</div>
</body>
</html>

css部分

/* CSS Document */
body {
	font-size: 13px;
	font-family: "微软雅黑";
	text-align: center;
}

#menu {
	width: 500px;
	margin: 10px auto;
}

#menu ul {
	margin: 0px;
	padding: 0px;
	background-color: #eee;
	list-style: none;
	line-height: 36px;
	text-align: center;
}

#menu ul li {
	display: inline;
	padding: 0 12px;
	border-right: dashed 1px #ccc;
}

#menu ul li.last {
	border-right: 0px;
}

a:link, a:visited {
	color: #000;
	text-decoration: none;
}
a:hover {
	color: #f00;
}