您的位置：首页 > Web前端 > CSS

XHTML（DIV+CSS）布局网页时，CSS文件定义规则

2010-01-29 00:37 726 查看

一、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>



<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 使用 <%-- --%>。

复制去Google翻译翻译结果

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航