链接不能继承color的原因

以下均为个人见解,如有错误之处,请大牛帮忙更正。

---------------------------------------

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <style type="text/css">
        div {
            color:yellow;
        }
    </style>
</head>
<body>
    <div>
        <span>文字</span>
        <a href="#">链接</a>
    </div>
</body>
</html>

起因是因为上面的代码,非常简单,但是问题出现了,链接不能继承父级div的color属性,span标签却能,解决办法十分简单,div a { color:yellow; }就可以搞定了,好奇心上来了,谁也拦不住,整吧。

到处问啊,先google了下,我去,这应该怎么说,让超链接继承颜色?找不到啊,郁闷了一下,找QQ群求助吧,一问吓一跳,大伙都知道,那你们怎么都不分享出来!刨根问底儿,大伙的意思就是背下来,想理解自己研究浏览器的代码怎么渲染,我想说我刚学一个月,但是还是忍忍作痛的说了声谢谢,ctrl+w。

转了一圈圈还是有些收获的,群里有个人说了句链接不能继承颜色,我勒个去,灵光乍现啊有木有,打开google复制粘贴,果然有相关的链接,嗯,这时候有了一个感受:问问题要问的准啊。

看了看,果然有一个CSDN的问题,看!打开。。额。。失败。。但是心情啊,还让不让人睡觉了,百度一下吧,一样的关键字,额。。。知道我下一步要说啥了吧。

昨天刚刚研究会hostsFQ,所以有很多问题,最近firefox也犯抽风,用了下chrome,看了看,链接在这里视线定格在2L。

“color定义的是普通文本(不包括超链接a)”,又是闪闪发光的一句话,咔咔咔,来段代码。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <style type="text/css">
        div {
            color:yellow;
        }
    </style>
</head>
<body>
    <div>
        <p>段落</p>
        <span>文字</span>
        <h1>标题</h1>
        <a href="#">链接</a>
        <button>按钮</button>
    </div>
</body>
</html>

嗯,有点道理,链接按钮都不算文本啊,就在我即将下结论的时候,看了下知乎,真的是知乎!问题链接 答案@马铖的真理般答案出现了!其实刚刚在QQ群里也有人说,但是被我一个样式重置表给忽略了,还是万分抱歉的。

随便找了个关于CSS优先级的问题的文章

确实写了,继承的CSS 样式不如后来指定的CSS 样式;

结论出现了:因为浏览器默认样式是直接指定到具体标签的,继承的CSS样式不如后来制定的CSS样式,所以出现了上述状况。

反省:

1.应该细细琢磨每个人的想法。

2.注意提问的方式。

3.以后还是先google吧。

时间: 2024-10-27 08:50:24

链接不能继承color的原因的相关文章

微信内app下载链接打不开的原因

我们都已经习惯在微信内分享网页链接和二维码了,通过扫描二维码下载APP或打开网页也成为大家惯用且非常方便的方式了.如此微信就成为了扫描二维码重要的工具,说到二维码大家第一反应就是打开微信扫一扫,这是用户习惯问题.很多商家也是熟知这一点,所以纷纷选择微信来推广h5.app或者营销活动之类的.然而大多数朋友使用微信分享转发链接的时候,都很容易碰到链接在微信中无法打开的问题.通常这种情况微信会给个提示?"已停止访问该网址"?,导致这个情况的因素有以下三点 1.分享链接被多人举报?2.链接含违

tomcat 配置https 外部链接显示证书不安全 原因找到为其他地方的链接用的ip地址,证书是发给域名的所以报错

启动两个端口为了80跳转 443 <Connector connectionTimeout="20000" port="80" protocol="HTTP/1.1" redirectPort="443"/> <Connector port="443" protocol="HTTP/1.1" SSLEnabled="true" scheme=&quo

CSS 继承深度解析

FROM ME: 之前在研究前端性能优化的时候,就有学习关于CSS中“善用CSS中的继承”. 原文:CSS Inheritance, The Cascade And Global Scope: Your New Old Worst Best Friends 译文:掘金翻译计划 我酷爱模块化设计.长期以来我都热衷于将网站分离成组件,而不是页面,并且动态地将那些组件合并到界面上.这种做法灵活,高效并且易维护. 但是我不想我的设计看上去是由一些不相关的东西组成的.我是在创造一个界面,而不是一张超现实主

经测试稳定可用的蓝牙链接通信Demo,记录过程中遇到的问题的思考和解决办法,并整理后给出一个Utils类可以简单调用来实现蓝牙功能

说明:这是本人在蓝牙开发过程中遇到过的问题记录和分析,以及解决办法. 在研究过程中,许多的前人给出的解决方案和思路指导对我相当有帮助,但并非都是可采取的解决方法, 经过本人对这些方法的测试和使用过后,给出自己的理解和解决方案,不一定是正确的,但这些方法的确可以解决问题. 如果有人遇到同样的问题,并且看到我的文章解决,那是我的荣幸. !!!!!!但特别需要说明的是,看的越多,不明白的越多,我的看法可能是完全错误的,这些方法只是暂时解决了我的问题, !!!!!!如果有人发现了我的错误,请私信或评论告

CSS 文本、字体、链接

CSS 文本属性可定义文本的外观. 通过文本属性,您可以改变文本的颜色.字符间距,对齐文本,装饰文本,对文本进行缩进,等等. 缩进文本 把 Web 页面上的段落的第一行缩进,这是一种最常用的文本格式化效果. CSS 提供了 text-indent 属性,该属性可以方便地实现文本缩进. 通过使用 text-indent 属性,所有元素的第一行都可以缩进一个给定的长度,甚至该长度可以是负值. 这个属性最常见的用途是将段落的首行缩进,下面的规则会使所有段落的首行缩进 5 em: p {text-ind

CSS基础-引入方法,选择器,继承

一.CSS引入方法:行内式.嵌入式.导入式.链接式. 1.行内式. 即:在标签的style属性中设定CSS样式. 例子:<div style="行内式</div> 2.嵌入式 即:将页面各种元素的设置集中写在<head></head>标签里. 例子: <head> <style type="text/css"> div{ background-color:blue; } </style> </

CSS学习摘要-层叠和继承

当有多个选择器作用在一个元素上时,哪个规则最终会应用到元素上? 其实这是通过层叠机制来控制的,这也和样式继承(元素从其父元素那里获得属性值)有关. 元素的最终样式可以在多个地方定义,它们以复杂的形式相互影响.这些复杂的相互作用使CSS变得非常强大,但也使其非常难于调试和理解. 层叠 CSS 是 Cascading Style Sheets 的缩写,这暗示层叠(cascade)的概念是很重要的.在最基本的层面上,它表明CSS规则的顺序很重要,但它比那更复杂.什么选择器在层叠中胜出取决于三个因素(这

动态链接详解

动态链接 动态链接的诞生: 动态链接产生最主要的原因就是静态链接空间浪费过于巨大,更重要的是现阶段各种软件都是模块化开发,不同模块都是由不同厂商开发的,一旦一个模块发生改变,整个软件就需要重新编译(静态链接的情况下). 动态链接主要思想: 把链接这个过程推迟到了运行时再运行,这就是动态链接(Dynamic Linking)的基本思想. 动态链接的好处: 1.动态链接将共享对象放置在内存中,不仅仅节省内存,它还可以减少物理页面的换进换出,也可以提高CPU缓存的命中率,因为不同进程间的数据与指令都集

CSS样式-链接

能够设置链接样式的CSS属性有很多.链接的特殊性在于能够根据他们所处的状态来设置它们的样式.链接的四种状态: a:link 普通的,未被访问的链接 a:visited 用户已访问的链接 a:hover  鼠标指针位于链接的上方 a:active  链接被点击的时刻 当为链接的不同状态设置样式时,请按照以下次序规则: a:hover 必须位于 a:link 和 a:visited 之后 a:active 必须位于 a:hover 之后 常见的链接属性: color属性规定链接显示的颜色 text-