设为首页 加入收藏 网站首页
休闲娱乐
军事·社会百态·娱乐八卦·校园
体育·美女写真·幽默笑话·游戏
综合·在线视频·搞笑图片·灵异
两性生活
两性知识·性爱技巧
情色实录·两性图片
女性健康·同性之恋
电脑网络
网络编程·网页制作·软件教学
操作系统·图形图象·冲浪宝典
网络安全·邮件系统·认证考试
热点专题
芙蓉·真人漫画
72式·欲望都市
帅哥·人体彩绘
您现在的位置: 世纪中国 >> 网页制作 >> CSS教程 >> 教程正文
调整CSS类型的顺序改变链接状态
作者:中国图霸    教程来源:网络    点击数:    更新时间:2007-1-2

  你也许已经意识到,你可以通过指定每一键接的不同风格以建立CSS翻滚效果,这些链接包括普通的链接link (normal), 访问,翻转,以及激活。并且,你可能也知道CSS类型的顺序可以产生效果上的差别,CSS代码后顺序的风格将会取代针对于相同元素的前顺序的风格。建立翻滚效果的类型顺序显得相当重要。

  现在让我们看看如何安排链接状态的类型在不产生冲突的情况下支持正常的翻滚效果,并且如何重新安排这些类型顺序以获得不同的翻滚效果。

  链接状态

  典型的CSS翻滚效果依赖于超链接中四个状态之一的独立类型。可以建立附带CSS预先类的(超链接)类型以指定链接状态:

  a:link——常规,非访问超链接

  a:visited——访问超链接

  a:hover——访问者操作鼠标通过时的链接

  a:active——点击链接

  为了能够使典型的CSS翻滚效果正常工作,CSS代码中的CSS类型顺序显得非常重要,无论它是一个外部类型表格或者是嵌入在HIML页标题栏中的类型规则。

  a:link类型出现的时间为最早,因为它可应用于所有的链接。a:visited类型排第二,它将取代任何链接的a:link格式。(如果a:link类型紧跟着的是a:visited,a:link可能会取代a:visited类型。)其次是a:hover类型,此类型只应用于访问鼠标下的链接。最后是a:active,所以,当链接被点击时,它可以取代所有其它的类型。

  CODE:

以下是引用片段:
  a:link {
  color: #0000FF;
  text-decoration: underline;
  font-weight: normal;
  font-style: normal;
  }
  a:visited {
  color: #3399FF;
  text-decoration: underline;
  background-color: #FFFFFF;
  font-weight: normal;
  font-style: italic;
  }
  a:hover {
  color: #0000FF;
  text-decoration: underline;
  background-color: #FFFF00;
  font-weight: bold;
  font-style: normal;
  }
  a:active {
  color: #FF0000;
  text-decoration: none;
  background-color: #CCCCCC;
  font-weight: bold;
  font-style: normal;
  }


  在CSS代码中的类型顺序确定了每一种类型如何取代其它的类型,即更多的类型可以应用到特定的元素。正常情况下,a:hover类型处于a:link和a:visited类型之后,所以hover状态的类型可以应用于常规和访问的链接。但是,它也并非必须遵循这一方式,你可以改变类型顺序实现不同的效果。

  假设你想在非访问链接中使用翻滚效果,但不想影响到其它访问链接,你或许想到通过代码来处理这种外形上改变,然而你所要做的是重新组织CSS代码。

  从访问链接中移除翻滚效果,可以通过很简单地移除a:visited类型。

  注意,a:visited类型中包含指定所有与a:hover相同属性的规则,否则,当访问者的鼠标通过一个访问链接时,没有被a:visited类型取代的任何a:hover类型属性将会继续再现。

分类推荐
社会 社会 娱乐 军事 校园
幽默 体育 女性 专题
电脑 编程 网页 软件 系统
安全 图象 冲浪 认证
搞笑 人物 动物 物品 表情
签名 色图 漫画 奇闻
美女 明星 清纯 自拍 欧美
丝袜 卡通 性感 走光
两性 知识 性图 孕育 技巧
同性 单身 情感 实录
视频 写真 搞笑 MTV 翻唱
写实 片段 游戏 综艺
CSS教程热门文章
普通教程 CSS垂直树形下拉菜单
普通教程 CSS+JS实现的选项卡效果(html组
普通教程 用CSS做滑动效果的图片画廊
普通教程 用CSS设计高体验的表单显示效果
普通教程 网页制作之常用CSS缩写语法总结
普通教程 CSS实现导航条图片的翻转菜单
普通教程 CSS仿淘宝首页导航条按钮布局效
普通教程 超强,用CSS构建iframe效果
普通教程 完全CSS写的鼠标悬停tip效果
普通教程 对css滑动门技术的一些总结和归
普通教程 用CSS层叠样式表完成可以控制的
普通教程 常用CSS
普通教程 CSS+DIV网页特效欣赏:非常酷的
普通教程 CSS+DIV设计实例:纯CSS制作下
普通教程 CSS属性中Display与Visibility
普通教程 利用CSS控制打印
普通教程 内联CSS的background-image属性
普通教程 导航上用CSS标志当前页效果的实
普通教程 CSS的常用技巧放送
普通教程 XHTML+CSS兼容性解决方案小集

  广东广州海珠区 世纪网络工作室 版权所有 上海电信提供网络带宽
信箱: 9297659@qq.com 粤ICP备06113754号