div+css处理链接的:link,:visited,:hover,:active四种状态

原创 2007年09月23日 15:08:00

div+css处理链接的:link,:visited,:hover,:active四种状态

[示例代码]

<html>
    <head>
        <style>
            a:link {background-color: red; color: white;}
            a:visited {background-color: yellow; color: black;}
            a:hover  {background-color: green; color: white;}
            a:active {background-color: blue; color: white;}
        </style>
    </head>
    <body>
        <div>
            <a href="http://a.link/">
                链接的默认效果是a:link中的效果
            </a>
        </div>
        <div>
            <a href="">
                访问过的链接的效果是a:visited中的效果
            </a>
        </div>
        <div>
            <a href="http://blog.csdn.net/hu_zhenghui">
                鼠标移动到链接上的效果是a:hover中的效果
            </a>
        </div>
        <div>
            <a href="http://blog.csdn.net/hu_zhenghui">
                鼠标单击链接时的效果是a:active中的效果
            </a>
        </div>
    </body>
</html>

[div+css关键词]

div css

[div+css重要工具]

Internet Explorer Developer Toolbar, http://www.microsoft.com/downloads/details.aspx?FamilyID=e59c3964-672d-4511-bb3e-2d5e1db91038&amp;displaylang=en

[div+css的常见问题]

较验div+css格式,http://validator.w3.org/
div+css的margin缩写方式
div+css的padding缩写方式
链接的:link,:visited,:hover,:active四种状态

[div+css的浏览器兼容问题]

水平居中,Firefox使用margin-left: auto; margin-right: auto; IE6 使用text-align: center;
垂直居中,Firefox中使用display: table-cell; vertical-align: middle;可以实现div垂直居中,而IE6中则需要借助IE6中css的特点实现垂直居中。
!important标记,Firefox支持!important标记,IE6忽略!important标记
手形鼠标指针,使用cursor: pointer;
版权声明:本文为博主(@胡争辉)原创文章,未经博主允许不得转载。

相关文章推荐

css的嵌套选择器用法总结

css复合选择器的使用规则 1、id嵌套class #myid.myclass: 。 2、一个元素标签使用多个class。.important.warning 注意不要有空格 。有空格表示分别适用于两...
  • mochong
  • mochong
  • 2017年03月28日 14:07
  • 1637

Mac 版 android studio 如何获取SHA1值

获取debug.keystore的值: keytool -list -v -keystore ~/.Android/debug.keystore -alias androiddebugkey...

CSS A link hover active visited伪类超链接锚文本样式应用用法案例

我们设置一个超链接,对其设置CSS样式,通过CSS A设置其四种样式效果。通过一个简单的对文本设置css a样式情况了解学习CSS a锚文本样式。 1、案例css代码   .divcss5 a:...

在CSS中定义a:link、a:visited、a:hover、a:active顺序

代码 Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.co...

CSS样式表中a:link,a:visited,a:hover,a:active属性

CSS样式表中a:link,a:visited,a:hover,a:active属性含义a:link,a:visited,a:hover,a:active 分别是什么意思,有什么用途 明了的:  ...

CSS定义中a:link,a:visited,a:hover,a:active 分别是什么意思?

CSS定义中a:link,a:visited,a:hover,a:active 分别是什么意思? 假如CSS放在Style文件夹下,页面引用时: <link href="Style/...
  • 99guo
  • 99guo
  • 2011年09月05日 15:22
  • 9498

CSS中的:link :visited :hover :active

link:连接平常的状态 visited:连接被访问过之后 hover:鼠标放到连接上的时候 active:连接被按下的时候         详细的:  :hover版本:C...

【经验】在CSS中定义a:link、a:visited、a:hover、a:active顺序

摘自:http://www.qianyunlai.com/post-2.html     以前用CSS一直没有遇到过这个问题,在最近给一个本科同学做的项目里面。出现一些问题,搜索引擎...

29-超链接样式的设置(link hover visited)

New Document a:link{ color:black; text-decoration:none; font-size:24px; } a:hover{ text-dec...

谈一谈a:link、a:visited、a:hover、a:active的正确使用顺序

今天学到一个有趣的新知识呢,迫不及待的想分享一下。自学前端的这条路上,还在基础部分打转,未来好难,走好现在脚下的每一步才是我现在最重要的。小小地感慨一下,下面进入正题吧。 1. 标签 我们先说...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:div+css处理链接的:link,:visited,:hover,:active四种状态
举报原因:
原因补充:

(最多只允许输入30个字)