采用XHTML和CSS设计可重用可换肤网页

　　1、重新设计站点的HTML

　　首先我们要去掉网页中有关外观的标签。在以前的代码中，我们常用一个表格用来在页面的内容中创建一个有边框的区块，我们还使用〈b〉来加粗文本。用来改变字体颜色等等。用

　　标签来创建段落等。

　　而要做出能适应XHTML标准和能随意换肤的网站，我们须要避免在页面中使用有关外观的标签。使文档结构和表示形式分离的一个最大的好处就是它使文档在没有CSS时，仍然可以使用和访问。表现(就是文档看上去的样子)在一个支持性好的浏览器中也将呈现的不一样，但是它的内容将永远不变，大多数情况，对于访问网站的人来说，内容实际上比表现的方式更加重要。这就是为什么给那些支持性不好的浏览器发送一个没有样式的页面，要比把他们排斥在外要好的原因。

　　现在比较流行的做法是使用DIV、SPAN等标签来布局整个页面，而TABLE,UL,PRE,CODE等标签来显示数据，用UL是用来显示无序的列表信息，而OL显示有序的列表信息。这将比用TABLE来显示一个列表更有语义上的意义，同时UL和OL在浏览器中比TABLE标签更快有下载速度，并且相对于TABLE，CSS对UL和OL的外观控制更加灵活。当然对于复杂的数据，比如报表，用TABLE来显示仍然是不二的选择。

　　2、建立基本的通用样式

　　由于所有的XHTML文件都是由各种各样的HTML标签和标签内的文字组成，而一些基本的标签在每个XHTML文件都存在的，如:body、table、td、div、h1—h6、ul、li、input等等，如果我们定义好了这些标签的CSS样式，如:字体，字号，行距，背景色，背景图等等，我们就有了一个基本的样式风格，就如同在Word或PowerPoint中的主题，每个主题就是一套风格样式。 因此，我们可以根据基本的HTML标签定义出一个通用的样式来，例如建立一个siteComm.css文件，定义如下:
　　/*文中的样式表语法中的"("及")"为示例所用,因为blog每次保存花括号都出现错误。请在使用时改为正确的符号*/

　　BODY
　　(
　　background: url(images/bg_page.jpg);
　　font: 10pt verdana,arial,;
　　margin-top: 0px;
　　margin-left: 0px;
　　margin-right: 0px;
　　margin-bottom: 0px;
　　)
　　H1, H2, H3, H4, H5, H6
　　(
　　border-bottom: solid 1px #ccc;
　　margin: 1em 0;
　　)
　　TD
　　(
　　font: 10pt;
　　)
　　A:link
　　(
　　color: #057AE0;
　　text-decoration: none;
　　)
　　A:visited
　　(
　　color: #057AE0;
　　text-decoration: none;
　　)
　　A:hover
　　(
　　color: #009900;
　　)
　　A:active
　　(
　　color: #009900;
　　)

你有email邮箱吗？经常收到垃圾邮件而烦吗？立即使用邮箱LOGO在线制作酷Email logo图片