仓酷云

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 1215|回复: 8
打印 上一主题 下一主题

[DIV+CSS] 来谈谈:了解(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。
冷月葬花魂 该用户已被删除
沙发
发表于 2015-1-17 05:54:09 | 只看该作者
在刚开始接触网页的第一堂课上,听说网页制作会是一门很无聊并且很难听懂的过程,而事实却印证了这样一个事实。
老尸 该用户已被删除
板凳
发表于 2015-1-20 14:33:37 | 只看该作者
Dreamweaver在所见即所得添加链接,也可以先选中文字或图片然后在属性栏中的链接栏后的一个小圆圈,用鼠标点击小圆圈按住不放拖动出箭头然后指向文件即可。
活着的死人 该用户已被删除
地板
发表于 2015-1-29 09:10:22 | 只看该作者
由CS4 版本开始,则转用WebKit 排版引擎(亦即Google Chrome和Apple Safari浏览器所用的排版引擎)作为网页预览。
分手快乐 该用户已被删除
5#
发表于 2015-2-6 00:17:13 | 只看该作者
Adobe Dreamweaver(前称Macromedia Dreamweaver)是Adobe公司的著名网站开发工具。
再现理想 该用户已被删除
6#
发表于 2015-2-14 14:24:24 | 只看该作者
所见则所得网页编辑器的优点就是直观性,使用方便,容易上手.
不帅 该用户已被删除
7#
发表于 2015-3-4 07:13:26 | 只看该作者
Dreamweaver8中文版(dw)是由Macromedia公司开发的一款所见即所得的网页编辑器。和二维动画设计软件FLASH,专业网页图像设计软件FIREWORKS,并称为“网页三剑客”。
飘灵儿 该用户已被删除
8#
发表于 2015-3-19 05:48:57 | 只看该作者
Dreamweaver在所见即所得添加链接时,可以在选中文字后在属性栏中的链接栏中直接输入文件的地址即可。
蒙在股里 该用户已被删除
9#
发表于 2015-3-27 08:32:43 | 只看该作者
难以逾越的障碍会大大打击你的学习积极性。这就需要你的恒心,坚持不懈的决心。在自己无法解决某些问题时,就需要虚心请教别人.
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|仓酷云 鄂ICP备14007578号-2

GMT+8, 2024-4-27 10:21

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表