zoukankan      html  css  js  c++  java
  • 同一html页面中不同链接的不同样式

    超链接的样式有:

    a:link 链接未点击上去时候
    a:visited 链接已经点击过的
    a:hover 鼠标放在链接上未点击
    a:active 是介于hover visited 之间的一个状态,可以说是链接被按下时候的状态

    大家都知道想要设置统一的连接样式,只要在css文件中设置a:link,a:visited,ahover,a:active就行了。可以设置全局的连接样式。比如:

    <!--chrome浏览器下可以将链接原始属性都写在a:link中,IE内核的浏览器中链接的原始属性中除下划线之外的属性需写在a中-->
    a
    {
    font-size
    : 12px;
    color
    : #4C4C4C;
    }
    a:link
    {
    text-decoration
    : none;
    }
    a:visited
    {
    text-decoration
    : none;
    color
    : #990000;
    }
    a:hover
    {
    text-decoration
    : underline;
    color
    : #0D488C;
    }
    a:active
    {
    text-decoration
    : none;
    color
    : #0D488C;
    }

    但是有的时候为了一些效果,想要设置一些针对某些特殊连接的样式,就需要在CSS中继续进行加工了。常用的方式有:

    1.增加连接样式命名: 

    <!--chrome浏览器下写法-->
    a.a1:link
    { color: #FF0000; text-decoration: none;}
    a.a1:visited
    { color: #FF0000; text-decoration: none;}
    a.a1:hover
    { color: #606060; text-decoration: underline;}
    a.a1:active
    { color: #606060; text-decoration: underline;}
    <!--IE下写法,Chrome下适用-->
    a.a1
    { color: #FF0000; text-decoration: none;}
    a.a1:visited
    { color: #FF0000; text-decoration: none;}
    a.a1:hover
    { color: #606060; text-decoration: underline;}
    a.a1:active
    { color: #606060; text-decoration: underline;}
    <!--IE、Chrome下都适用-->
    a.a1,a.a1:link
    { color: #FF0000; text-decoration: none;}
    a.a1:visited
    { color: #FF0000; text-decoration: none;}
    a.a1:hover
    { color: #606060; text-decoration: underline;}
    a.a1:active
    { color: #606060; text-decoration: underline;}

    调用a1即可,同样方式可以定义a2,a3……或你自己起的名字(a1,a2……为我自己起的名字)

    注:IE下的写法在Chrome中有着同样的效果,Chrome中的写法在IE下有时可能不起作用

    2、div定义命名:

    div.other a:link{……},a:visited{……},a:hover{……},a:active{ text-decoration:none; 
    color
    :#eefffe;
    font-size
    :28;
    }

    在调用处写other即可,同样方式,还可以起其它名字

    推荐一个自己业余时间开发的网盘搜索引擎,360盘搜www.360panso.com



  • 相关阅读:
    IPC之——消息队列
    特殊命令
    面试概念集锦
    守护进程(精灵进程)
    IP SSL HTTPS
    钉钉监控样例
    中间人攻击
    iptables firewalld
    简单暴力高效率的OSM全球地图
    解决ubuntu使用命令sudo apt -get install 安装东西时出现"E: Sub-process /usr/bin/dpkg returned an error code (1) "的错误 问题描述:
  • 原文地址:https://www.cnblogs.com/eczhou/p/2377433.html
Copyright © 2011-2022 走看看