第3讲 输入与格式化文本 教师:谢慧敏
内容导航 2.1 课堂案例:制作“公司简介”页面 行业提示:制作文本类型网页的注意事项 2.1.1 新建与保存网页 2.1.2 设置页面属性 2019/4/6 内容导航 2.1 课堂案例:制作“公司简介”页面 行业提示:制作文本类型网页的注意事项 2.1.1 新建与保存网页 2.1.2 设置页面属性 2.1.3 输入文本 2.1.4 设置文本字体格式 2.1.5 设置段落格式 2.2 课堂案例:制作“企业文化”页面 2.3 项目实训 2.4 课后练习 2.5 技巧提升
行业提示:制作文本类型网页的注意事项 当要使用大量的文本来表现网页内容时,对于文字的内容需要是先校对,避免错别字等问题,其次,大段的文字会给浏览者带来视觉疲劳,因此,由文本构成的网页需要对文本设置能够凸显层次但又不花哨的格式。
2.1.1 新建与保存网页 选择【文件】/【新建】菜单命令,打开“新建文档”对话框,在其中选择需要新建文档的 类型,这里保持默认设置,单击 按钮。选择【文件】/【保存】菜单命令,在打开的“另 存为”对话框中选择“wangye”文件夹作为保存位置,在“文件名”文本框中输入“gsjj.html”, 单击 按钮。
2.1.2 设置页面属性 选择【修改】/【页面属性】菜单命令打开“页面属性”对话框,在“分类”栏中选择“外 观(CSS)”选项。在“页面字体”下拉列表框中选择“编辑字体列表”选项,打开“编辑字 体列表”对话框,在“可用字体”列表框中选择“宋体”选项,单击左侧的“添加”按钮,单 击 按钮将“选择的字体”列表框中的字体添加到“字体列表”列表框中,然后利用相同的方 法添加其他几种常用的字体,单击 按钮。 添加字体
2.1.2 设置页面属性 在“页面字体”下拉列表中选择“宋体”选项,在“背景颜色”文本框中输入“#D21775”。 在“分类”列表框中选择“标题/编码”选项,在“标题”文本框中输入“公司简介”,其他保 持默认,单击 按钮应用设置。 设置页面外观和标题
2.1.3 输入文本 1. 直接输入文本 直接输入文本的方法很简单,只需新建或打开网页,在需要输入文本的位置单击鼠标定位 插入点,切换到需要的输入法并输入文本即可。
2.1.3 输入文本 2. 导入文本 导入文本能有效地减少输入文本的工作量,在Dreamweaver CS6中可以导入Word文档和 Excel表格等软件中的文本,其方法为:选择【文件】/【导入】菜单命令,在弹出的子菜单中 选择需要导入文本所在的软件,如“Word文档”,此时将打开“导入Word文档”对话框,在 其中选择需要的文件后,单击按钮即可将该文档中的所有文本导入到Dreamweaver CS6中。
2.1.3 输入文本 3. 复制文本 打开素材“gsjj.txt”文件,按【Ctrl+A】组合键选择其中的所有文本,按【Ctrl+C】组合键执 行复制操作,将插入点定位到“gsjj.html”网页文件中,按【Ctrl+V】组合键即可粘贴复制文本。
2.1.3 输入文本 4. 换行与分段 在“有限责任公司”文本右侧单击鼠标定位插入点,按【Enter】键分段文本。在第3段文 本中的“自主品牌”文本右侧单击鼠标定位插入点,按【Shift+Enter】组合键换行文本。
2.1.3 输入文本 5. 输入空格 单击鼠标定位插入点,按【Ctrl+Shift+Space】 组合键即可插入一个空格。连续按多次可输入 多个空格。
2.1.4 设置文本字体格式 1. 设置HTML字体格式 为网页中的文本设置HTML字体格式的操作非常简单,选择文本后,在操作界面下方的 “属性”面板中单击 按钮,然后通过调节面板中的参数进行设置即可。
2.1.4 设置文本字体格式 2. 设置CSS字体格式 拖曳鼠标选择第一段文本,在“属性”面板中单击按钮,单击“字体”下拉列表框右侧的 下拉按钮,在打开的下拉列表中选择“微软雅黑”选项;打开“新建 CSS 规则”对话框,在 “选择或输入选择器名称”下拉列表框中输入“font01”,单击 按钮。
2.1.5 设置段落格式 1. 设置标题格式 选择需设置格式的标题文本(也可选择其他文本),单击“属性”面板中的 按钮, 在“格式”下拉列表框中选择需要的标题格式即可。
2.1.5 设置段落格式 2. 设置对齐方式 输入需要的文本并将其选择,将字体格式设置为“12、白色、加粗”,将新建的CSS规则 命名为“font03”,保持文本的选择状态,单击“右对齐”按钮即可。
2.1.5 设置段落格式 3. 设置文本缩进 文本缩进是指文本与页面边缘的距离,其设置方法很简单,只需选择文本或将插入点定位 到该文本中,单击“属性”面板中的 按钮,单击“内缩区块”按钮可增加缩进距离;单 击“删除内缩区块”按钮可减少缩进距离。
内容导航 2.1 课堂案例:制作“公司简介”页面 2.2 课堂案例:制作“企业文化”页面 2.2.1 插入特殊文本对象 2.2.2 创建列表 2019/4/6 内容导航 2.1 课堂案例:制作“公司简介”页面 2.2 课堂案例:制作“企业文化”页面 2.2.1 插入特殊文本对象 2.2.2 创建列表 2.2.3 设置水平线 2.2.4 添加滚动字幕 2.3 项目实训 2.4 课后练习 2.5 技巧提升
2.2.1 插入特殊文本对象 1. 插入日期 选择【插入】/【日期】菜单命令。 打开“插入日期”对话框,在“星期格式”下拉列表 框中选择“星期四”选项,在“日期格式”列表框中选择“1974年3月7日”选项,在“时间格 式”下拉列表框中选择“22:18”选项,单击 按钮。
2.2.1 插入特殊文本对象 2. 插入特殊符号 选择【插入】/【HTML】/【特殊字符】/【商标】菜单命令。 此时插入点处将快速插入商 标字符,该字符的格式自动应用了商标字符的专用格式。
2.2.2 创建列表 1. 添加项目符号和编号 单击“属性”面板中的 按钮,然后单击 “项目列表”按钮。
2.2.2 创建列表 2. 编辑项目符号和编号 无论是项目符号还是编号,只要选择了相应 的段落,并在“属性”面板中单击 按钮,均可在打开的“列表属性”对话框中 进行设。
2.2.3 设置水平线 在“公司公告”文本右侧单击鼠标定位插入点、选择【插入】/【HTML】/【水平线】菜单 命令。 此时即可在插入点下方插入一条水平线。
2019/4/6 2.2.4 添加滚动字幕 输入需要滚动的字幕内容,并为其应用“font02”格式,单击界面上方的 按钮,在左侧 的代码视图中利用【Enter】键在输入的字幕内容上下方各空出一行。在上方的空行中输入 “<marquee behavior=”alternate“ scrollamount=”10“>”,在下方的空行中输入“</marquee>”。
Thank you!