精华内容
下载资源
问答
  • a链接有几种伪类

    a链接有几种伪类?

    link、visited、hover、active四种,当一个链接有多种伪类时,顺序依次排列,该顺序即“爱恨原则”(LoVe/HAte)。

    伪类顺序为什么不能更改?

    这个问题可以这样来解答。
      首先注意关键的两点:1.这4个伪类特指度相同。2.一个链接可能同时处于多种状态,即同时属于多个伪类。
      好,现在来详细剖析。
      未点击链接前,link伪类长期处于激活状态,鼠标悬停(或点击)时,a链接同时处于link和hover(或active)状态,由于它们特指度相同,在同时激活的情况下,后出现的伪类样式会覆盖前面的伪类样式,故link状态必须写在hover(或active)之前。
      再讨论hover和active的顺序,若把hover放在active后面,当点击链接一瞬,实际你在激活active状态的同时触发了hover伪类,hover在后面覆盖了active的颜色,所以无法看到active的颜色。故hover在active之前
      其次,若把visited放在hover后面,那已访问过的链接一直触发着visited伪类,会覆盖hover样式。
      最后,其实link、visited两个伪类之间顺序无所谓。(因为它俩不可能同时触发,即又未访问同时又已访问。)

    __后面内容转自此处

    展开全文
  • css定义超链接是要先后顺序的。否则,可能会出现某个或某个样式不起作用的bug。例如:visited与hover顺序颠倒了,则不能显示hover和active的样式了。 正确的顺序: ...还有UI伪类选择器中的顺序: :hov...

    css定义超链接是要有先后顺序的。否则,可能会出现某个或某几个样式不起作用的bug。例如:visited与hover顺序颠倒了,则不能显示hover和active的样式了。

    正确的顺序:

    a:link 未访问过的 样式
    a:visited 访问过的 样式
    a:hover 鼠标处于鼠标悬停状态的 样式
    a:active 当鼠标左键按下时,被激活的 样式。

    还有UI伪类选择器中的顺序:

    :hover

    :foucs

    :active

    转载于:https://www.cnblogs.com/yuxingyoucan/p/5657909.html

    展开全文
  • a标签的四种伪类顺序

    千次阅读 2015-06-17 10:04:46
    关于伪类,大家最熟悉的还是a标签的4个伪类: :link 有链接属性时 :visited 链接地址已被访问过 :active 被用户激活(在鼠标点击与释放之间发生的事件) :hover 其鼠标悬停 关于这四个伪类的排列次序,很多...
    关于伪类,大家最熟悉的还是a标签的4个伪类:
    :link        有链接属性时
    :visited    链接地址已被访问过
    :active     被用户激活(在鼠标点击与释放之间发生的事件)
    :hover      其鼠标悬停

    关于这四个伪类的排列次序,很多地方都能查到,可是为什么这么排列?从来没有见过有人提及。这里我就从技术、用户体验、优先级几个角度简单的阐述下我们为什么这么排列。

    首先从技术层面上,

    a的这四个伪类,分别表示了a的四种状态,要注意的是,a可以只具有一种状态(:link),或者同时具有2种或者三种状态!比如说,任何一个有HREF属性的a标签,在未有任何操作时都已经具备了:link的条件,也就是满足了有链接属性这个条件;如果访问过的a标签,同时会具备 :link :visited 两种状态。把鼠标移到访问过的a标签上的时候,a标签就同时具备了 :link :visited :hover三种状态。

    其次从用户体验的角度,

    在用户使用超链接的时候,为了最佳的用户体验,要做到下面几点:
    第一:不管是否是被访问过的超链接,只要我鼠标移上的时候(:hover)都要有写变化,比如变色、加下划线等等,告诉用户选中的是可以点击的超链接。
    第二:不管是否访问过,在a标签被激活时(:active),都应该有相同的样式变化。也就是说,同一个a标签,未访问过时在被用户激活和被访问时再被用户激活时要有相同的样式。这个也很好理解,用户点下同一个超链接时的效果不应该有差别。

    第三:访问过的a标签可能要跟没有访问过的a相区分。


    从CSS优先级角度,

    前面的文章讲过具体的css优先级,这里我要说的是对于同一优先级的相冲突样式,浏览器的选择问题。比如:
    .test {color:red; color:green;}
    或者:
    .test {color:red;}
    .test {color:green;}




    上面两个例子中,大家都知道,对于这个.test指向的内容,浏览器会显示后一个属性设置。也就是color:green.

    说到这里,很多人可能已经有头绪了。结合上面的三点,不难分析我们为什么要这么排。

    第一:不管什么情况下鼠标悬停都应该有一个样式变化(:hover),我们就把hover放在最后,防止具备其他状态时,被其他状态的设置覆盖掉。
    第二:当a被激活时(:active),我们要求不管是否访问过,都应该有相同的样式,也就是这个状态的效果应该能够覆盖未被访问时(:link)与 已访问过(:visited)两种状态。应该放在 :link :hover的后面。
    第三:被访问过的a(:visited)可能会有不一样的样式属性,用来区别a是否被访问过。也就是说:visited 状态的属性可以覆盖掉:link状态的属性, 即 :visited 要放在 :link 的后面。

    展开全文
  • 超链接的伪类

    2020-09-03 16:55:19
    链接几种状态 链接的不同状态都可以不同的方式显示,这些状态包括:活动状态(鼠标点击时的状态),已被访问状态,未被访问状态,和鼠标悬停状态。 超链接的伪类 :link 未访问的链接 :visted 访问过的链接,但...

    链接的几种状态

    链接的不同状态都可以不同的方式显示,这些状态包括:活动状态(鼠标点击时的状态),已被访问状态,未被访问状态,和鼠标悬停状态。

    超链接的伪类

    • :link 未访问的链接
    • :visted 访问过的链接,但由于隐私的原因,:visted这个超链接伪类只能修改访问过的链接的颜色,而不能修改大小等。
      注:以上这两个伪类选择器只有超链接才有,即a标签独有。

    两个其他的伪类选择器

    • :hover 表示鼠标移入的状态

    • :active表示鼠标正在点击的状态
      注:这两个伪类选择器对所有标签有效。

    <!DOCTYPE html>
    <html lang="zh">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
    
        <style>
            /*未访问过的链接设置为红色  */
            a:link{
                color: red;
            }
            /* 访问过的链接设置为绿色 */
            a:visited{
                color: green;
            }
            /* 鼠标移入当前超链接时变蓝,且变大 */
            a:hover{
                color: blue;
                font-size: larger;
            }
            /* 鼠标点击时变黄且变小 */
            a:active{
                color: yellow;
                font-size: small;
            }
           
        </style>
    </head>
    <body>
        <a href="https:www.baidu.com">访问过的链接</a>
        <br><br>
        <a href="https:www.baidu123.com">未访问过的链接</a>
    </body>
    </html>
    
    展开全文
  • CSS锚伪类有以下几种: 1 a:link{color:pink} /*未访问的链接*/ 2 a:visited{color:red} /*已访问的链接*/ 3 a:hover{color:blue} /*鼠标移动到链接上*/ 4 a:active{color:green} /*选定的链接*/ ...
  • CSS伪类选择器

    2020-10-15 17:18:33
    常用的伪类有以下个: a:link {color: #FF0000} /* 设置未访问的链接样式 */ a:visited {color: #00FF00} /* 设置已访问的链接样式 */ a:hover {color: #FF00FF} /* 设置鼠标移动到链接上样式 */ a:active {...
  • 什么是伪类? CSS伪类用于向某些选择器添加特殊的效果。 它的语法结构为: div:hover { property: value ; } css3中的是使用 :: 一般的伪类 :: 和 : 是...动态伪类包含以下几种: link 还未被访问的链接 visite
  • 一天坑之--css伪类,hover消除

    万次阅读 2016-10-20 20:03:43
    精通css里是这么解释伪类的作用的:根据文档...伪类有这么几种条件:link visited(这些都只能应用于锚元素,也就是指定超链接的元素,所以它们也叫链接伪类),hover,active ,onfous(统称动态伪类)。 link和visit
  • 第四十二章 伪类

    2019-03-06 16:37:59
    因为对于链接,它本身是有几个状态的。首先是我们完全没有搭理它的状态,就是最普通的默认状态;然后当我们的鼠标放上去的时候,又是一状态;当我们的鼠标按下去,还没有抬起来的时候,就是正在点击这个链接的状态...
  • w3cschool中,伪类有如下的几种: :active 向被激活的元素添加样式。 :focus 向拥有键盘输入焦点的元素添加样式。 :hover 当鼠标悬浮在元素上方时,向元素添加样式。 :link 向未被访问的链接添加样式。 :visited 向...
  • 2020-12-03选择器

    2020-12-03 17:31:24
    伪选择器 伪选择器不是选择元素,而是元素的某些部分,或仅在某些特定上下文中存在的元素。 主要类型 : 伪类和伪元素。 伪类和伪元素的区别 1)伪类用于当已元素处于的某个状态时,为其添加...链接伪类 link:
  • css链接颜色

    千次阅读 2019-06-01 09:11:36
    css链接颜色以下几种情况:1、无状态:没有任何作用于此链接;2、点击过的;3、鼠标置于连接上;4、点击过程中 css称这些链接状态为伪类选择器,在css思考方式里,"真"类属性是用class=的属性来明确指定的,而...
  • 也谈opencart的静态功能

    千次阅读 2010-09-03 11:55:00
    也谈opncart的静态功能今天分析了一下opencart的URL链接,总结一些小经验.opencart是构建了一个轻量级的MVC框架,总体来说思路都是比较清析的.URL重构这一块,就是分类(category)为例吧.opencart默认就URL重写这...
  • 介绍3,4月份暑期实习招聘~准备了许久,看了网上不少的总结帖子,准备过程中,学习到了许多。 看过一句话~ 技术水平涨的最快的两个阶段,一个面试前个月,一个是入职后...3. 哪些伪类 4. 纯css实现对话框带
  • 网软分类信息网站系统.net正式版下载分类信息网站模板系统预设了信息类别,针对不同信息具有不同的发布表单和查询界面。具有会员注册、分类信息发布、会员积分、实名验证,信息管理等功能。采用灵活的可视化...
  • 网软分类信息网站系统.net正式版下载分类信息网站模板系统预设了信息类别,针对不同信息具有不同的发布表单和查询界面。具有会员注册、分类信息发布、会员积分、实名验证,信息管理等功能。采用灵活的可视化...
  • 2.内页展示提供两样式,默认为showurl.asp样式,上面导航条,另一为showurl1.asp样式,直接跳转到对方网站,用户使用哪,只要将文件名改为showurl.asp即可! 3.为防止用户修改后台模板出错,将首页模板和分类页模板,...
  • css-选择器

    2015-03-16 21:33:19
    标记选择器 p{ /* 标记选择器 */ color:blue;...a标记四种状态能描述这种响应,分别是a:link、a:visited、a:hover、a:active,a标记在这几种状态下的样式能够通过伪类选择器来分别定义,伪类选择
  • 事件流都会经历三个阶段:标准事件模型IE事件模型IE事件模型共有两个过程:四、href与src区别五、为什么JavaScript需要写在最后面六、`==` 与 `===`七、``链接伪类顺序八、如何判断一个数是否为NAN下列代码解释 ...
  • 4.5.1 调用样式表的几种方法 4.5.2 应用样式的优先级 4.6 网页头部实例 第 5 章 CSS 基本布局属性 第50 页 5.1 页面的制作流程和整体分析 5.2 元素定位基础知识 5.2.1 块元素的默认排列 5.2.2 内联元素的默认排列 ...
  • css实现移动端1px边框怎么解决

    千次阅读 2017-10-01 10:33:33
    ,原理就是通过transfrom:scaleX scale scaleY这个函数进行缩放,废话不多说,直接撸代码,分别是:底边,上边,左边,右边,还有四个边框都,在文章末尾相关知识的介绍链接,本文就不会浪费文字在
  • 移动端1px边框实现

    千次阅读 2017-04-18 15:40:25
    ,原理就是通过transfrom:scaleX scale scaleY这个函数进行缩放,废话不多说,直接撸代码,分别是:底边,上边,左边,右边,还有四个边框都,在文章末尾相关知识的介绍链接,本文就不会浪费文字在
  • 移动端1px问题

    2017-09-19 16:00:00
    ,原理就是通过transfrom:scaleX scale scaleY这个函数进行缩放,废话不多说,直接撸代码,分别是:底边,上边,左边,右边,还有四个边框都,在文章末尾相关知识的介绍链接,本文就不会浪费文字在这些...
  • java线程状态——java线程状态图

    千次阅读 2017-02-14 17:03:08
    java线程状态图,网上很多资源,无外乎两,如下: 图一 图二 图二是比较多的,可以看出来我贴出的链接这个博主挺有心的,还把右下角的水印给抹去了,赤裸裸的原创心理呀。 还有张图说的也挺不错的,链接...
  • 1,安装杰奇程序 2,上传模板文件到对应的目录,重复就覆盖 3,进入后台->数据维护->数据库升级...7,格式的静态规则,分别是.htaccess和httpd.ini,请根据需要使用。 8,友情链接在区块那里,区块ID是69

空空如也

空空如也

1 2 3 4 5
收藏数 93
精华内容 37
关键字:

链接伪类有几种