【问题标题】:CSS Change links color on mouse hoverCSS 在鼠标悬停时更改链接颜色
【发布时间】:2018-11-12 09:10:07
【问题描述】:

我有以下 CSS 部分,其中包含普通文本和一些网络链接。我需要在段落部分将鼠标悬停在更改颜色的链接上。我该怎么做?

我试过了:

        ul.contact li p:hover a {
        color: #eb050183;
    }

我的 CSS

ul.contact li {
    position: relative;
    border-top: solid 1px #ddd;
    padding: 1.3em 0 1.3em 7em;
}

    ul.contact li h3 {
        position: absolute;
        left: 0;
        top: 1.3em;
        font-size: 1.1em;
    }

    ul.contact li p {
        margin: 0;
        font-size: 0.9em;
    }

    ul.contact li:first-child {
        padding-top: 0;
        border-top: 0;
    }

        ul.contact li:first-child h3 {
            top: 0;
        }

【问题讨论】:

  • 请点击<>并创建minimal reproducible example
  • 您的代码无法正常工作,仅仅是因为您在ul 后面漏掉了一个空格。应该是ul .contact li p:hover a

标签: html css colors hyperlink hover


【解决方案1】:

我认为您错过了 text-decoration:none; 的锚标记。将此与颜色属性一起添加。还悬停a a:悬停{颜色:#FF00FF}

【讨论】:

    【解决方案2】:

    要更改悬停时锚链接的颜色,您需要按如下方式设置 CSS:

     ul.contact li p a:hover {
            color: #eb050183;
        } 
    

    【讨论】:

    • OP 希望通过悬停 p 来更改链接颜色,而不是悬停链接本身
    猜你喜欢
    • 1970-01-01
    • 2018-07-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-11-24
    • 2013-03-09
    • 1970-01-01
    相关资源
    最近更新 更多