Dreamweaver网页设计项目教程 王雪松 项目二 任务4网页美化与特效4新.pptVIP

Dreamweaver网页设计项目教程 机械工业出版社 任务4网页美化与特效4（建议2学时） 任务实施 任务实施 导航当前页美化 （1）应用类样式 1）返回index.html，选中头部#search中的“按钮”，在属性窗口中选择类下拉列表菜单，选择“.naw_main_current”，如图所示 ： 任务实施 导航当前页美化 （1）应用类样式 2)实时显示效果如图： 在Index.html中，类样式“.nav_main_current”已经添加到了表单代码中，如图所示： 任务实施 导航当前页美化 （1）应用类样式 Index.html中，代码： Li a href=#class=nav_main_current onmouseover=MM_ShowHideLayers (nav_Son,,show) onmorseout=MM_ShowHideLayers (nav_son,,hide) span首页/span /a/Li 任务实施 导航当前页美化 （2）设置当前页导航文字颜色。 由于背景设置成的白色与导航文字设置的颜色相同，影响显示效果，因此必须为当前导航文字重新设置一种颜色。 1）创建#nav_main span的CSS样式。单击CSS样式面板下方的“新建CSS规则”按钮，在弹出的“新建CSS规则”对话框中做如图所示的设置，设置完成后单击“确定”按钮。 任务实施 导航当前页美化 （2）设置当前页导航文字颜色。 2）单击“确定”按钮后，弹出“#nav_main span的CSS规则定义”对话框，在类型样式中，设置它的前景色(color)为#646464，如图所示： 任务实施 导航当前页美化 （2）设置当前页导航文字颜色。 3）返回index.html的代码窗口，光标定位在头部#nav_main中的“首页” 导航文字前，输入“”（注意：一定是英文半角状态），系统会给出提示，输入“s”（代码一定要小写，上一节我们已经讲过。），所有“s”打头的标签全部显示出来，选中“span”（选择时用“方向”键或鼠标均可），如图所示： 任务实施 导航当前页美化 （2）设置当前页导航文字颜色。 4）“首页”后输入“/”，系统会自动给出结束标签，如图所示： 任务实施 导航当前页美化 （2）设置当前页导航文字颜色。 5）插入标签后span的代码及效果如图所示：