来谈谈：了解(X)HTML的文档布局

显示全部楼层 · 发表于 2015-1-16 00:12:21

马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。

您需要登录才可以下载或查看，没有帐号？立即注册

x

在网页制作中，有许多的术语，例如：CSS、HTML、DHTML、XHTML等等。在下面的文章中我们将会用到一些有关于HTML的基本知识。
CSS经由过程与(X)HTML的文档布局绝对应的选择器（selector）来到达把持页面体现的目标，而文档布局不单单在CSS的使用上十分主要，关于举动层（比方利用JavaScript把持元素的举动）一样也十分主要。

4.1文档布局

(X)HTML文档能够看做一个家属树，这个树有1个先人——根元素，然后各元素顺次向下分列，比方有XHTML代码以下，其文档树如-1所示。

<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/>
<title>文档布局与选择器</title>
</head>
<body>
<h1>第3章<em>CSS进门</em></h1>
<p><acronymtitle="CascadingStyleSheets，层叠款式表">CSS</acronym>是一种标志性言语。</p>
<ol>
<li>CSS的<em>优弱点</em></li>
<li>CSS的利用办法
<ul>
<li>内联式款式</li>
<li>嵌进式款式表</li>
<li>内部款式表</li>
</ul>
</li>
<li><strong>基础</strong>款式划定规矩</li>
</ol>
<p>CSS经由过程与(X)HTML的文档布局绝对应的<ahref="selector01.html"title="关于选择器的内容">选择器（<em>selector</em>）</a>来到达把持页面体现的目标。</p>
</body>
</html>

-1文档布局树

CSS年夜部分才能是基于元素的“父子”干系，假如元素A包括了元素B，那末元素A就是“父元素”，被包括的元素B是“子元素”。每一个元素都是另外一个元素的“父”大概“子”大概二者都是。比方：<body>既是<html>的子元素，又是<h1>的父元素。在家属树中，父子元素是相连的，并且父元素在子元素的下面一层。
“父”与“子”偶然候又被一样平常化为“先人（或称先辈）”和“儿女（或称子孙）”，从一个元素到另外一个元素两头超过了一层或更多层，就是“先人/儿女”干系。比方-1中，<html>就是<h1>的先人，<h1>则是<html>的儿女。<body>是一切扫瞄器能显现的元素的先人，而<html>是一切元素的先人，也称为“根元素（root）”。“先人/儿女”干系包括“父子”干系。
有着不异父元素的元素之间互为“兄弟”干系。比方-1中，<h1>和<ol>为兄弟干系，<body>是它们配合的父元素，<ul>里的3个<li>也相互为兄弟干系。

提醒：良多选择器都是针对文档布局婚配的，因而把握文档布局的意义十分主要。
你的设计不仅仅用于web浏览器，也可以发布在其他设备上，比如PowerPoint。

		自动登录	找回密码
密码			立即注册

[DIV+CSS] 来谈谈：了解(X)HTML的文档布局

马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。

相关帖子