DW第三讲 网页编辑(页面属性与文字)
第三章网页文本的编辑与控制

利用HTML处理网页文本 处理网页文本 利用
(3)设置文字和超链接的颜色
设置正文和超链接颜色时,可以使用BODY标记符的text、link、 设置正文和超链接颜色时,可以使用BODY标记符的text、link、 vlink和alink属性。 vlink和alink属性。
(4)设置页面背景声音
在HEAD中添加: HEAD中添加: < BODY BGSOUND src=“网页背景声音的地址”> src=“网页背景声音的地址”
利用HTML处理网页文本 处理网页文本 利用
设置页面属性
(1)设置页面背景颜色 在<BODY>标记符中使用bgcolor属性可以为网页设置背景颜色。 <BODY>标记符中使用bgcolor属性可以为网页设置背景颜色。 其格式为:<BODY 其格式为:<BODY bgcolor = “#ff0066”> #ff0066” (2)设置页面背景图像 选择特定图案作为页面的背景,使用BODY标记符的background 选择特定图案作为页面的背景,使用BODY标记符的background 属性即可。 HTML语句为:<BODY background="网页背景图案的地址"> HTML语句为:<BODY background="网页背景图案的地址">
注意:XHTML要求标记符区分大小写!养成习惯都用小写。 注意:XHTML要求标记符区分大小写!养成习惯都用小写。
绝大多数标记符都是成对出现的, 绝大多数标记符都是成对出现的,包括开始标记符和结束标记 符。某些标记符,例如<BR>,只要求单一标记符号。 某些标记符,例如<BR>,只要求单一标记符号。
怎么使用dreamweaver制作网页教程 dw建站设计网页

怎么使用dreamweaver制作网页教程 dw建站设计网页Dreamweaver是一款专业的网页制作软件,被广泛应用于网页设计师的日常工作中。
它是一款视觉化网页开发工具,可以轻松制作出跨越平台和浏览器限制的充满动感的网页。
在本文中,我们将为您介绍如何使用Dreamweaver制作网页。
一、定义站点1.在任意一个根目录下创建一个文件夹(例如E盘),并为其命名(例如MyWeb)。
2.打开Dreamweaver,选择“站点-新建站点”,在对话框中输入网站名称和本地根文件夹路径(E:web),然后确定。
此时再次打开Dreamweaver,会自动找到刚才设立的站点。
二、创建页面1.在本地文件夹E:\MyWeb下,右键点击空白处,选择“新建文件”,建立一个页面。
默认的文件名为untitled.htm,将其改名为index.htm。
2.双击index.htm进入该页面的编辑状态。
在标题空格里输入网页名称,按右键选页面属性,打开“页面属性”窗口。
在这里可以设置网站的标题、背景颜色或背影图像,超级链接的颜色(一般默认即可),其他都保持默认即可。
3.在页面中添加文字,可用菜单“窗口/属性”打开属性面板,选取文字大小为6,再使文字居中,然后在文字前用几个回车使其位于页面中间。
4.如果需要选取字体,则选择字体中的最后一项“编辑字体列表”,在对话框中选+号,接着在“可用字体”栏中选择需要加入到字体列表中的一种字体,点击中间的按钮就可以加入了。
三、为页面添加图片在页面中添加图片,可用菜单“插入/图片”,选择本地图片路径,然后将其拖拽到页面中即可。
Dreamweaver是一款非常强大的网页制作软件,通过本文的教程,相信您可以轻松上手制作出精美的网页。
1、在本地文件夹E:\MyWeb下新建文件夹,用于存放图片,可更名为tu、pic或images。
2、打开对象面板,选择“插入图像”,在对话框中选择要插入的图片。
若出现对话框“是否将该文件复制到根文件夹中?”,需选择“是”,并保存到刚建立的文件夹中。
用dw做网页的技巧

用dw做网页的技巧
许多人喜欢用dw做网页,那幺如何做的更好呢,下面就是用dw做网页的技巧,希望能够给大家提供帮助。
定义大小不变的文字
更改浏览器字体大小设置,网页中字体尺寸也会发生变化。
如果使用了网页中的CSS样式表技术,就不会出现上述情况了。
使用快捷键
“Shift+F11”打开样式表“CSS Style”编辑器,在窗口中单击鼠标右键执行“New CSS Style...”命令,新建一个控制文字字体、字号属性的样式表,并将其添加到页面中,可以看到页面文本发生的变化。
预览时试试定义的文本字体尺寸还会不会随浏览器的选择字体大小而改变。
去掉超链接文字下的下划线
通过编辑样式表可以实现该目的,执行菜单“text”→“CSS Style”→“Edit Style Sheet...”命令,弹出Edit Style Sheet窗口,点击“New”按钮,选择弹出窗口中重定义HTML标记(Redefine HTML Tag),并在Tag选单中选择a,保存后编辑该样式表,选择type的Category类型,在右边定义Decoration?装饰 中选择“None”。
一次链接到两个网页
超链接一次只能连到一个页面,如果一次在不同的框架页中打开文档,可以使用“Go To URL”行为。
打开一个有框架的网页,选择需要超链接的文字或图像,然后从Behaviors行为面板中选择“Go To URL”行为。
在弹出Go To URL对话框中显示所有可用的框架,选择其中一个我们想链接的框架并输入相应的URL,然后再选择另一个框架并输入另一个URL即可。
改变状态栏提示文字。
第5章_DW简介、建立站点与编辑网页

工具栏
代码视图
设计视图
当我们在设计视图中选择视图选项的显示文件头内容,则在界面上方会出现相应的 文件头内容标签,如标题等。
一般情况下,文件头内容都在插入面板->HTML中的子项里
状态栏
属性窗口
(2)创建与管理站点
1.新建本地站点
在Dreamweaver中建立本地站点的方法如下。 (1)在文档窗口中选择“站点”菜单中的“新建站点”命令或“站点”面板 “站点”菜单中的“新建站点”命令,打开“定义站点”对话框,选择“高级” 选项卡(也可按“基本”选项卡中的向导操作,但不如用“高级”选项卡方便) 。 (2)在“站点名称”文本框内输入站点名称,例如localsite。该站点名称只是 在Dreamweaver中的一个站点标识,因此可以采用中文名称。 (3)在“本地根文件夹”文本框旁边单击“浏览”按钮 ,在打开的“选 择站点localsite的本地根文件夹”对话框中,定位到事先建立的站点文件夹,或 者在打开的对话框中单击“新建文件夹”按钮 创建一个新文件夹,如图2.6所 示。选定文件夹后,“站点定义”对话框中相应文本框的内容自动更新。 (4)在“默认图像文件夹”文本框旁边单击“浏览”按钮 ,用同样的方 式指定站点中用于存放图像的文件夹。这样设置之后,以后网页中要用到的 图像文件都应该放到该文件夹,以便统一管理。 (5)其他选项保持不变,单击“确定”按钮,此时站点面板中出现新建的 站点窗口。
页面属性是指网页的一般属性信息,例如,网页标题、网页的背景颜色、背 景图像、超链接颜色、跟踪图像等。
1.设置网页标题
网页标题是用来说明网页内容的文字,通常显示在浏览器窗口的标题栏中。 通常每个网页都应该有一个标题,而网页标题文字最好能够恰如其分地描述网页 的内容。 设置网页标题的方法为:在文档窗口工具栏中的“标题”文本框内直接输入 网页的标题文字,也可以在打开的“页面属性”对话框中的“标题”文本框内设 置网页的标题。
文本与网页属性设置2

按shift+Enter键。
2、插入特殊字符
方法一:在菜单栏选择“插入”→“HTML” →“特殊字符”
方法二:将插入栏切换到文本类,再单击 字符按钮选择要插入的特殊字符。
3、插入批注文字
在菜单栏选择“插入”→“注释” 或在插入 栏单击“注释”按钮,弹出“注释”对话框, 输入注释文字后,单击“确定”按钮。
由于批注只有在编辑网页时或查看原代码时才 能看到,所以不必担心批注文字破坏版面。
4、查找和替换文本
在菜单栏选择“编辑”→“查找和替换”
5、拼写检查
在菜单栏选择“编辑”→“查找和替换” 如果没有拼写错 误,则弹出提示拼
写检查完成对话框。
如果文字内容有 错误,则弹出“检 查拼写”对话框, 提示进行修改。
二、设置文本属性
1、文本属性栏 打开文本属性栏的方法:
(1)按快捷键Ctrl+F3
(2)在菜单栏选择“编辑”→“属性”
2 、 设 置 文 本 格 式
三、文本列表
1、创建 2、修改
无序列表 有序列表
四、添加水平分隔线
添加:选择插入栏的HTML类,单击“水平线” 按钮;或在菜单栏选择“插入”→“HTML”
→“水平线” 。
修改属性:用鼠标选择水平分隔线,则主窗
口的属性栏自动变成如下图所示的水平分隔线
属性栏,在此面板中设置水平分隔线的属性。
五、网页属性设置
打开页面属性对话框的方法: 右击空白的网页,在弹出的快捷菜单中 选择 “网页属性”命令。 在菜单栏选择“修改”→“页面属性”。 在属性栏单击“页面属性”按钮。
文本与网页属性设置
一、编辑文本 二、设置文本属性 三、文本列表
四、添加水平ห้องสมุดไป่ตู้隔线
第3章在网页中使用文本

4、文本的HTML标记应用
每个HTML标记都由标记符对(或单标记符)和属性组成, 其一般格式为:
<标记符 属性1=属性值1 属性2=属性值2…> 受影响的内容 </标记符>
或<标记符 属性1=属性值1 属性2=属性值2…>
这个可以在“设计”视图里进行设置。具体步骤如下:
1)选择“页面属性”命令按钮,弹出“页面属性”对话框。
2)在页面属性对话框窗口左侧选择“分类”列表中“标题/编 码”命令,在右侧“编码”下拉列表框中选择“简体中文 (GB2312)”选项即可。
设置对话框技巧:一旦进行了编码设置,可以查看一 下“编辑”菜单下面的“首选参数”命令,在“分类”列表 框的“字体”类别里的“字体设置”命令也会发生相应的变 化。在查看“代码”视图时,感觉字体、大小不合适,也可 以在“分类”列表框的“字体”类别里设置字体、字体大小。
2)文字的拼写检查:单击“文本”菜单/“检查拼写”命令, Dreamweaver会检查网页内所有英文单词的拼写是否正常,如 果全部正常,则调出检查完毕的提示框;如果有不正确的英文 单词,则将调出“检查拼写”对话框。该对话框中会列出错误 的英文单词并推荐更改的英文单词,供用户修改错误的单词。
(2)文字的查找与替换
10. 选中联系方式的四行文字切换“常用工具栏”为“文本 选项”,点击其上的编号列表“”按钮。
11. 重复步骤3插入页面底部的水平线并设置其属性。 12. 在水平线,后面按【Enter】键。输入版权信息,设置其
属性为居中对齐,插入版权符号。
13. 插入日期。
网页DREAMWEAVER知识点总结
网页DREAMWEAVER知识点总结网页DREAMWEAVER总结一、站点新建与站点打开新建站点\高级中设置站点名与路径导入素材(复制\粘贴)新建网页、打开网页、保存网页、预览网页网页改名网页属性设置(背景设置、文字颜色设置等)二、网页编辑文字编写——空格插入、项目符号、段落与换行符注意:换行符的显示设置(编辑/首选参数)、圆圈项目符号设置(标签检查器)插入图片、图片编辑(边框)注意:图片边框颜色设置(CSS标签定义)、图片上放文字或动画、交换图像插入 Flash动画——透明设置插入水平线(高度、宽度、颜色设置)——标签检查器参数设置插入滚动字母(图片、系列图片、动画等)——标签检查器参数设置插入嵌入式框架插入APPLET——注意参数设置插入HTML脚本——复制代码到网页代码中即可插入导航条插入表单---文本区域背景设置等(CSS标签定义)插入Spry菜单或Spry选项卡三、超链接设置链接对象:文字、图像、图像中某部分、Flash动画等可链接到:网页、网页中某位置、网址、电子邮件、其它文件等链接目标:自窗口中、新建窗口中、框架集中某框架中、嵌入框架中所有超链接设置(链接设置、悬停设置、点击时设置、访问过的设置)——可在“网页属性”中设置颜色——可在“CSS样式”中设置颜色、文本、大小等特定超链接设置(链接设置、悬停设置、点击时设置、访问过的设置)——可在“CSS样式”中定义新的样式文件来设置颜色、文本、大小等,然后手工套用到某个超链接上四、网页布局表格:定义设置、宽度、边框、对齐、选择,表格嵌套(表格背景图片设置)层(AP元素):插入、位置设置、层中插入表格、各类对象、滚动字幕框架:框架集和框架定义、边框、框架的行高或列宽五、样式类、标签、高级样式的定义掌握基本的样式定义——如标签td、textarea、img及高级中超链接定义六、行为对象:文字、单元格、图片等对象事件:鼠标点击、鼠标移动到对象上、鼠标移开对象等驱动操作:交换图像、弹出信息、打开游览器窗口、显示-隐藏层、拖动操作例如——利用显示-隐藏层进行下拉菜单制作。
第03章
3.2 处理段落
3.2.1 设置段落格式 使用【属性】面板的【格式】弹出式菜单或选择【文本】| 【段落格式】菜单可以应用标准段落和标题标签。 3.2.2 对齐段落 段落的对齐方式,指的是段落相对文档窗口(或浏览器窗 口)在水平位置的对齐方式。有三种对齐方式:左对齐、 居中对齐、右对齐、两端对齐。 3.2.3 缩进段落 许多时候需要缩进段落,例如希望强调一段文字,或引用 其他来源的文字,都需要将文字缩进,以示同普通段落的 区别。所谓缩进,主要是相对于文档窗口(或浏览器窗口) 左端而言的。
3.7.3 简答题 (1)简述美化文本的意义? (2)简述编辑文本格式具有那些样式? 3.7.4 操作题 通过表格布局一个页面,并完成页面内容 的添加。最后对td、body标签进行定义,设 置字体为宋体9磅字。
本节学习结束
(2)若要插入更多的特殊字符,请选择______ | ______ | ______或在______栏
中选择______图标,选择一个字符,然后单击【确定】。
3.7.2 选择题 (1)设置文本属性可以通过_______来设置。 A.属性面板 B.控制面板 C.启动面板 D.文本菜单 (2)在网页中连续输入空格的方法是_______。 A.连续按空格键 B.按下Ctrl键再连续按空格键 C.转换到中文的全角状态下连续按空格键 D.按下Shift键再连续按空格键
3.3.3 添加字体颜色 打开【文本】菜单,选择【颜色】,可以 打开Windows标准的颜色对话框,允许用户 选择颜色,如图所示。
3.3.4 设定字体样式 字符的样式指的是字符的外观显示方式,例如字符的加粗、 倾斜和下划线等,利用Dreamweaver,可以设置多种字符 样式。 1. 加粗 2. 倾斜 3. 下划线 4. 删除线 5. 打字型 6. 强调 7. 加强 8. 代码,变量,范例和键盘 9. 引用和定义 10. 已删除 11. 已插入
网页三剑客 - dw
(1) 创建锚记 (如下图)
• 将光标定位在要插入锚记的位置,或选中要指定锚记的文本;
• 点击菜单栏 “插入” —— “命名锚记” ;
• 通过鼠标的拖拽 可以改变锚记的位置。
网页三剑客之Dreamweaver 14
2.2 超级链接
(2) 实现锚记链接 (如下图)
• 选中要链接的图片或文字; • 点击菜单栏 “插入” —— “超级链接” ,或者直接在文本属性面板直接输入“ # 锚记名称” 。
• 填 充:单元格内容和边之间的距离;
• 边 框: 边框粗细,0时即无边框; • 类:用于CSS样式的; • 边框颜色: 16进制、颜色单词和RGB; • 清除宽/高:根据内容进行调整大小; • 将宽度转为百分比:按窗口缩放。
网页三剑客之Dreamweaver
18
2.4 表格应用
(3)单元格的属性:
网页三剑客之Dreamweaver
21
2.5 层的应用
(3)层的操作 ( 层面板 ) :
• 显示/隐藏层 :单击 可显示隐藏层;
• 防止重叠:
勾上就可以不让层重叠在一起;
设置数字,越大的越在上面;
• 设置层叠顺序:
• 层的嵌套:光标移动到要嵌套的层里再插入一个层。
图1
网页三剑客之Dreamweaver
“制表符”形 式
网页三剑客之Dreamweaver 3
1.1 Dreamweaver 8 基本操作
3. 文档工具栏 -- 通过快捷按钮可以控制文档的视图显示。
【设计】按钮可以查看设计的网页画;
【代码】按钮可以查看和编辑网页代码;
【拆分】按钮还可以同时查看代码和设计画面。
显示代码视图 设计视图 设定网页标题 文件管理
第5章设置文本和网页属性
第5章设置文本和网页属性重点内容:文档的基本操作输入文本查找与替换拼写检查格式化文本使用水平分隔线设置网页属性一、文档的基本操作1. 应用起始页新建文档在默认设置下,启动Dreamweaver后打开起始页面,该页面中列出了常用的任务。
单击起始页中各项目即可创建相应的内容。
2.应用新建命令新建文档选择“文件”|“新建”命令,打开“新建文档”对话框创建所需新文档。
Dreamweaver始页面“新建文档”对话框3.保存新文档创建新文档后,在编辑之前可以将其保存。
这样,在以后的编辑过程中随时都可以按下Ctrl+S键续存新内容,可以避免因断电、死机等意外情况而造成更大的损失。
4.打开文档如果需要修改保存过的网页,则选择“文件”|“打开”命令,打开“打开”对话框。
然后选择文件保存位置,单击要打开的文件。
单击“打开”按钮,在Dreamweaver中打开所选文档。
打开文件更简便的方法二、添加文本对象1.添加普通文本确定插入点后可直接输入所需的文本。
输入文本时涉及3种换行方式:自动换行:如果一行的宽度超过了文档窗口的显示范围,文字将自动换到下一行。
硬换行:在需要换行的文字后按回车键。
Shift+回车:换行且中间又不显示较大间隔。
2.插入特殊字符使用插入命令:选择“插入”|HTML|“特殊字符”菜单中的对应命令使用工具栏按钮:单击“插入”工具栏左端的名称按钮,从弹出的下拉菜单中选择“文本”名称,切换到“文本”工具栏。
单击“文本”工具栏右端的“字符”按钮,从弹出的下拉菜单中选择与需要插入的字符相对应的菜单命令。
下面我们练习在页面中插入à、‰及®字符。
(1) 选择【插入】|【HTML】|【特殊字符】|【其他字符】命令,打开【其他字符】对话框,如右图所示。
(2) 单击要插入字符à的位置,单击【确定】按钮。
(3) 弹出提示对话框,提示用户“文档不使用西欧字符编码,则特殊字符字符可能不会出现在所有浏览器中”,单击【确定】按钮,如右图所示。
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
预览的概念
作用 1.上传前在本地浏览器中浏览网页.(F12) 2.不必保存即可预览.(但为了加快运行速度,最好保 存后预览)
GB2312,中文简体) 跟踪图象:相当于特殊的辅助线,是网页排版 的一种辅助手段,只在网页编辑时 可见,对最终结果没有影响。
注意与背景图象的区别.
对文字的一些操作
换行
Shift+Enter(软回车) 间距较小 代码:<br> Enter(硬回车) 间距较大 代码:<p>...</p>(段落)
空格
中文输入法,全角 参数设置/允许多个连续空格 代码视图中输入 插入工具栏/字符/空格符号
滚动文字 代码: <marquee>要滚动的文字</marquee> 各项属性: direction=“方向 ” bgcolor=“背景色”
Dreamweaver课件
第三讲
网页编辑(页面属性与文字)
主要内容
页面属性的设置 对文字的一些操作 预览的概念
(在站点面板中双击网页文件即可编辑此页面)
页面属性的设置(P38)
标题 背景颜色、背景图象、文字颜色、链接颜色 顶部边界、左边界 文档编码:设置此文档的编码方式(默认
第三讲总结
最简单的页面编辑,理解预览的作用. 要求:熟悉文本的操作.