为什么给h2设置字体大小不生效呢?

图片描述

图片描述
图片描述

这里把font-size:16px;挪到h2的样式里,页面显示字体大小无变化。

如果把*{font-size:12px;}去掉的话,h2设置字体大小就有生效。

阅读 10.1k
3 个回答

*选择器就是重置所有标签的样式,也就是a的字体就是12px,而你在h2里设不设置字体大小,并不会影响字体a的大小。
下面的情况去掉*的字体大小,那a没有设置字体大小的话,默认继承的是父级的

第一种情况,你设置了afont-size16px,所以是有效。
第二种情况,你把属性设置移到了h2里,此时如果没有

* {
    font-size: 12px;
}

的话文字字号应该是不变的,因为a标签会继承父元素h2的属性,但是因为有通配符*的存在,它选择了所有的标签并设置了字号,所以它的设置会覆盖继承自h2的属性, that's all

sorry,之前因为代码书写错误导致没有重现问题哦~~

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>

        *{
            font-size:12px;
        }
        h2{
            font-size: 16px;
            text-align: center;
        }

        h2 a:link,h2 a:visited{
            color:red;
        }
    </style>
</head>
<body>
<h2> h2 heading</h2>
<h2><a href="#">descendant elements that are absolutely positioned. Therefore, the absolutely</a>></h2>
</body>
</html>

~h2 a的字体大小是16px啊~
CSS中通过选择器的特殊性值来安排样式属性的优先级及最终的使用值
*通配符的特殊性为0
而继承属性的特殊性没有,连0都没有,你可以假想的认为为一个-1
那么对于h2 a从h2中继承的font-size属性而言其特殊性没有
小于*通配符的特殊性0
所以浏览器将采用通配符指定的font-size样式~~~

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏