设为首页 | 收藏本站
首页>IT学院>网页设计>正文
Dreamweaver入门使用CSS设置页面格式
WWW.DBIT.CN 2006-8-9 8:47:11 热度:
 

  完成对导航条的所有单词的格式设置后,保存该页面,然后在浏览器中预览您的工作("文件">"在浏览器中预览")。

  您可以单击链接以确保其有效。

  添加鼠标经过效果

  现在,您将添加一个鼠标经过效果,使导航条块的背景色在每次鼠标指针经过某个链接时改变颜色。若要添加鼠标经过效果,请添加包含 :hover 伪类的新规则。

  关于…关于 :hover 伪类 伪类是一种影响 HTML 文档中的某些元素的方式,它不是基于文档本身的 HTML 代码,而是基于 Web 浏览器应用的其它外部条件。伪类可以是动态的,这表明当用户与文档交互时,页面上的元素可能会获取或丢失伪类。

  当用户把鼠标指针停留在已设置格式的页面元素上时,:hover 伪类会影响该元素的变化。例如,将 :hover 伪类添加到 .navigation 类样式 (.navigation:hover) 以创建新规则时,根据 .navigation:hover 规则的属性,所有用 .navigation 规则设置格式的文本元素都会发生变化。

  打开 cafe_townsend.css 文件。

  选择整个 .navigation 规则。  

Dreamweaver入门使用CSS设置页面格式(9)

选择整个 .navigation 规则

  复制文本("编辑">"复制")。

  在该规则的末尾单击一下,然后多按几次 Enter 键 (Windows) 或 Return 键 (Macintosh) 以创建一些空格。  

Dreamweaver入门使用CSS设置页面格式(9)

在该规则的末尾单击一下

  将已复制的文本粘贴("编辑">"粘贴")到刚创建的空格中。

  将 :hover 伪类添加到已粘贴的 .navigation 选择器中,如下所示:  

Dreamweaver入门使用CSS设置页面格式(9)

将 :hover 伪类添加到已粘贴的 .navigation 选择器中

  在新的 .navigation:hover 规则中,将当前的背景色 (#993300) 替换为 #D03D03。  

Dreamweaver入门使用CSS设置页面格式(9)

将当前的背景色 (#993300) 替换为 #D03D03

  保存并关闭该文件。

  在"文档"窗口中打开 index.html 文件,然后在浏览器中预览该页面("文件">"在浏览器中预览")。

  当您将鼠标指针停留在任何一个链接上时,可以看到新的鼠标经过效果。

本新闻共5页,当前在第5页  1  2  3  4  5  

 
上一篇:实例讲解网站被入侵后需做的检测
下一篇:网站风格概论
打印】【关闭
  相关文章:
·网页制作:CSS的常用技巧放送·动态CSS,换肤技术
·使用图片和CSS结合制作动画按钮·CSS中display 与visibility 的区别
·XHTML+CSS布局之XHTML应用小结·CSS超级技巧大放送合集
·网站设计之合理架构css·认清CSS的类class和标识id选择符
·网页制作教程:认识CSS的伪类·CSS自动实现网页打印版本
·使用html表格和CSS进行混合网页设·CSS的“顶级”技巧
·如何使用CSS来进行网页排版·网页设计引入CSS样式的五种方式
·用CSS代码轻松Diy你的网页滚动条·采用DIV+CSS布局的好处
☆联姻学院☆

保养电脑的26个窍门
文件夹删除不掉怎么办?
教你如何用手工迅速剿灭QQ广告
“熊猫烧香”病毒的病毒描述和
在Excel中只打印图表以外区域
Excel中只选中包含文本的单元
Windows XP操作系统的几个实用
用XP系统自带网络诊断程序解决
风雨雷电→自然现象动画实战技
Flash遮罩特效之百叶窗效果
十二个Dreamweaver鲜为人知的
如何用 Dreamweaver 批量做we
JavaScript的系统函数学习
Java之父:关于Java我也有遗憾
排除网上邻居使用4大常见麻烦
解除上网限制IP和MAC捆绑的破