曲径通幽论坛

标题: <div> -- 定义文档中的分区或节(division/section) [打印本页]

作者: easy 时间: 2013-3-30 09:04
标题: <div> -- 定义文档中的分区或节(division/section)
<div> 标签可以定义文档中的分区或节。

比如说，文档中有一块区域的内容的字体颜色希望全部是蓝色来显示，这时候就不必为每行添加同样的颜色标签。比较下面的代码：

<h3><font color="#0000FF">你好</font></h3>
<p><font color="#0000FF">曲径通幽</font></p>

<div style="color:#00F">
<h3>你好</h3>
<p>曲径通幽</p>
</div>

这段代码显示的效果为：
[attach]1484[/attach]
光从显示出来的效果图中看，使用单独颜色标签定义的“你好曲径通幽“ 和使用 <div> 标签定义的区块”你好曲径通幽“ 的颜色效果一样。但是使用独立的颜色标签，就让代码显得多余而累赘，而使用 <div> 进行统一的颜色分配，就显得简介多了。

使用现代浏览器，比如 chrome，在浏览网页的某个页面时，可以在页面的任意一个地方，右击弹出菜单，然后选择“审查元素”，这样就会看到相应部分的的 HTML 代码。利用这一点，可以顺便的观察一下 <div> 的使用，比如查看我们论坛的第一个版区“Operating System" ：
[attach]1485[/attach]
在上图中可以看到，整个版区用红色方框圈起来，这一块地方对应于代码中的 <div id="t_22" class="t"> 的区域。而 "Operating System" 字样这一小块则对应于代码中的<div class="h">中这一块。

在 <div> 标签中，id 和 class 是两个常用属性。

id 属性为一个元素分配一个唯一的名字。每个名字只能在被赋予的页面使用一次。比如上面的页面中包含 id 为 t_22 的这个 div ，那么其他的 div 或者别的元素就不能使用这个名字了。相反地，class 属性可以一般一边的使用在页面中。这里的描述，我们同样可以通过 chrome 的 ”审查元素“ 功能获得更直观的了解。

欢迎光临曲径通幽论坛 (http://www.groad.net/bbs/)