《三章网页图文CSS样式ppt课件.ppt》由会员分享,可在线阅读,更多相关《三章网页图文CSS样式ppt课件.ppt(14页珍藏版)》请在三一办公上搜索。
1、第三章 网页图文,韦妍,网页设计与制作,第三章 网页图文,多媒体元素的插入,教学任务,网页上的文本编辑,网页上的图像编辑,CSS样式设置文本格式,1,2,3,4,第三章 网页图文,3.3 在网页中插入各种媒体文件,3.3.1 插入透明Flash动画打开【页面属性面板】,在“外观(CSS)”或“外观(HTML)”中的“背景图像”栏中选择一副图像作为背景图像,如图所示。,第三章 网页图文,3.3 在网页中插入各种媒体文件,3.3.1 插入透明Flash动画将光标移到要插入Flash动画文件的位置,然后到【插入】面板的【常用】模式上“媒体”中单击SWF按钮,如图所示。,第三章 网页图文,3.3 在网
2、页中插入各种媒体文件,3.3.1 插入透明Flash动画从打开的【选择文件】对话框中找到所需的文件,然后单击 按钮回到Dreamweaver窗口后,光标位置会出现插入的动画文件图标。如图所示。,第三章 网页图文,3.3 在网页中插入各种媒体文件,3.3.1 插入透明Flash动画选择动画文件,然后在【属性】面板中设置Wmode选项为”透明“,可将Flash背景透明化,预览后效果如图所示。,第三章 网页图文,7,3.4 用CSS样式设置文本格式,在制作网页过程中,每页都会用到文字、图像以及表格、表单等元素。对于这些元素,如果没有CSS样式控制,是无法使页面美观的。各浏览器之间不兼容,也会导致同一
3、个网页在不同的浏览器中显示效果不同,而应用CSS样式则恰到好处地解决了这个问题。层叠样式表CSS(Cascading Style Sheet)可以用来自定义样式或改变默认样式,用于精确地控制网页内容的各种显示风格,提高编辑效率,美化网页。,第三章 网页图文,8,3.4 用CSS样式设置文本格式,3.4.1 CSS样式面板 菜单【窗口】|【CSS样式】或单击属性面板中的“CSS”按钮可以打开CSS面板,如下图所示。,第三章 网页图文,9,3.4 用CSS样式设置文本格式,3.4.2 新建CSS样式单击面板右下侧的“新建CSS规则”按钮,打开“新建CSS规则”对话框。选择“类”样式,并为新建的CS
4、S样式命名,如下图所示。,提示:样式名称不能使用中文,且不能包含空格符。,第三章 网页图文,10,3.4 用CSS样式设置文本格式,3.4.2 新建CSS样式确定后,在弹出CSS规则定义的对话框进行设置。如下图所示。,第三章 网页图文,11,3.4 用CSS样式设置文本格式,3.4.3 编辑CSS样式选择已创建的CSS样式,点击“编辑”按钮或右击选择“编辑”命令,可对已创建的CSS样式进行修改。,第三章 网页图文,12,3.4 用CSS样式设置文本格式,3.4.4 应用CSS样式选择需要应用CSS样式的文本,在CSS面板中,右击样式名称,在弹出的列表中选择“编辑”命令,或CSS样式属性的目标规则列表中选择所需的样式名称,可对已创建的CSS样式进行修改。,第三章 网页图文,实训项目,将WORD中的文本复制,粘贴到网页中,并根据效果图进行相关文本设置。在网页插入两张图片,并根据效果图对“图像属性”进行相关设置。选择一音频文件制作网页背景音乐。,Thank You!,网页设计与制作,