HTML 学习笔记(五)a:link……visited……hover……active……

来源:互联网 发布:程序员常用编辑器 编辑:程序博客网 时间:2024/06/03 18:01
<!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" /><title>无标题文档</title>
<style>body {}#container {width:1000px;margin:0 auto;background:#eee;}#header {width:100%;height:150px;border:#00CCFF solid;}#header .logo {width:380px;height:100px;float:left;}#header .top_nav {width:500px;height:38px;float:right;border:#660000 solid;}#header .welcome {height:60px;width:540px;float:right;border:#00CC66 solid;}#header .banner {width:100%;height:50px;background:#99CC00;clear:both;border:#990066 solid;}#header .banner li {list-style:none;float:left;width:150px;line-height:50px;}#header .banner li a {text-decoration:none;color:white;font:bold 24px "黑体";line-height:50px;}#header .banner li a:link {}#header .banner li a:visited {}#header .banner li a:hover {color:blue;background:white;}#header .banner li a:active {}#main {width:100%;height:500px;}.left {width:20%;height:100%;float:left;}.middle {width:60%;height:100%;float:left;}.right {width:20%;height:100%;float:100%;}#footer {width:100%;height:100px;}</style>
</head><body><form id="form1" method="post"><div id="container"><div id="header"><div class="logo"></div><div class="top_nav"></div><div class="welcome"></div><div class="banner"><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><li><a href="#">帮助</a></li></ul></div></div><div id="main"><div class="left"></div><div class="middle"></div><div class="right"></div></div><div id="footer"></div></div></form></body></html>