一、XHTML(DIV + CSS)的基本结构:
<!-- 以下两行是必须的 -->
<!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>DIV + CSS</title>
<!-- 以下一行是必须的,定义css文件的路径 -->
<link href="css/css.css" rel="stylesheet" type="text/css" />
<style type="text/css">
</style>
<script src="/js/js.js'/>" type="text/javascript"></script>
<script type="text/javascript">
</script>
</head>
<body>
</body>
</html>
说明:XHTML文件的所有标签必须关闭,例如HTML中的<br>、<hr> 必须是 <br />、<hr /> 。
二、CSS文件定义规则:
1、当在HTML中定义为 <div id="divID"></div> 时,在 css 文件 中对应的设置语法则是 #divID{} ;如果在HTML中定义为 <div class="divID"> </div>时,则在 css 文件 中对应的设置语法是 .divID{} 。
2、HTML中的一切元素都可以定义,例如:body、table、tr、td、th、form、img、input……,当HTML元素不包含在 <div></div> 中时,如果你要在 css文件 中设置它们,则直接写入元素的名称加上一对大括号{}就可以了,例如: body{…},table td{…}…… ,当HTML元素在<div></div>中 按照 ”第3点“ 和 ”第4点“ 的方式定义。
3、如果<div id="divID"></div> 这个层中包括了一个 <img></img>,则这个 img 在 css文件 中对应的设置语法应该是 #divID img {};如果 <img></img> 包含在 <div class="divID"></div> 这个层中时,则设置语法应该是 .divID img {} 。
4、如果<div></div>中有其他HTML元素,这些HTML元素有三种方式来定义 css:
(1)、给各个HTML元素定义一个 id 或者 class,然后按照 ”第1点“ 定义<div></div>的方式,采用 #id{} 或 .class{} 来定义该标签的 css (此时可以给各个相同元素定义不一样的 css);
(2)、采用“第3点“ 来给该标签定义 css ,例如:#divID table {} (定义 层divID下的<table></table>)、#divID table td{} (定义 层divID下的<table></table>下的<td></td>)、.divID table td{} (定义 层divID下的<table></table>下的<td></td>) …… ,(此时是为特定层的HTML元素定义,在同一层下的相同元素有一样的 css)
(3)、采用 ”第2点“ 的方法直接定义 css (此时整个网页文件中相同元素有一样的 css );
5、所有的 css 定义代码都应该写在大括号“ {} ”中 ,各样式属性结束用 “;” 属性和值直接使用“:”,例如:
body {
font-family: "微软雅黑";
……;
}
.divClass {
……;
……;
}
#divID {
……;
……;
}
table td {
……;
……;
}
6、css 中注释使用 /* */ ,XML、HTML使用 <!-- -->,JSP 使用 <%-- --%>。