1、使用标签<table></table>定义网页的表格,使用style赋值类型将显示在网页。
2、使用<tr>标签定义行,使用<th>定义表头,表头的文字自动加粗。
3、<tr>和<td>标签配合,定义每行中的表格数量,现在定义3行5列的表格。
4、使用<caption></caption>定义表格的标题。
5、表格分为三个部分,表头部,表主体,表尾部。
6、表头部和主体分别放标题和表格的内容,而表的尾部通常放的是页数。
从结构上看,你的代码少了个结束div的标记。从样式上看,这兼容性定有问题。样式的思路应该是,li左浮动,定大小。a只定颜色,字体大小等样式。a的class可以去掉。
哦,忘了说,最重要的是,你的文档没有声明,这样的做法是不好的,以后别人调试你代码的兼容性也是有问题的。
em这个单位,不同浏览貌似有不同的解释,建议用绝对的px
颜色也是尽量用数值。
综合上述,我重写了一下你的代码。
<!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/htmlcharset=gb2312" />
<title>无标题文档</title>
<style>
*{ margin:0padding:0},ul,li{list-style:none}<!--这行是简单的重置样式,去除了所有浏览的默认设置。 -->
#head{height:20pxwidth:100%background:#999overflow:hidden}
#head ul{width:800pxmargin:0 auto}
#head li{display:inlinefloat:left height:20pxoverflow:hiddenwidth:200pxborder-left:#fff 1px solidmargin-left:-1px}
#head a{ display:blockwidth:200pxheight:20pxbackground:#999color:#ffftext-align:centertext-decoration:none}
#head a:hover{background:#000}
</style>
</head>
<body>
<div id="head">
<ul>
<li><a href="index.php" class="dya STYLE4">首页</a></li>
<li><a href="#" class="dya STYLE4">收藏夹</a></li>
<li><a href="#" class="dya STYLE4">黑匣子</a></li>
<li><a href="#" class="dya STYLE4">联系方式</a></li>
</ul>
</div>
</body>
</html>