css - 标签内的字体系列

Question

当我在 a 中指定a了其字体系列的标签时div，字体系列似乎只影响 内的文本div，而不影响a标签内的文本。为什么会这样，如何解决？

<div style="font-family: 'Times New Roman', Times, serif"> Hello world! <a href="www.google.com"> Click here! </a> </div>

Answer 1

正如@John 在评论中提到的那样；您可能有一些其他 CSS 链接文件覆盖了您的font-family. 您可以使用 inline 继承属性，因为您div还具有定义的样式inline。

<a href="www.google.com" style="font-family: inherit;"> Click here! </a>

Answer 2

所描述的问题不是由发布的代码引起的，即原因在于未公开的代码部分。通常，设置例如font-family元素仅影响直接在元素中的文本，而不影响包含在内部元素中的文本。但是，如果内部元素没有 CSS 规则（在作者、用户或浏览器样式表中使用），则内部元素会font-family从其父元素继承。但在这种情况下，显然有一个 CSS 规则设置font-family在a元素上。

修复取决于使用了哪些其他 CSS 代码。这似乎不是一个真实的案例，而只是作为一个练习，所以最好使用不同的方法，例如

<div class="foobar"> Hello world! <a href="www.google.com"> Click here! </a> </div>

在链接的外部样式表或style页面元素中使用以下 CSS 代码：

.foobar, .foobar a { font-family: 'Times New Roman', Times, serif }

替换foobar为反映元素含义或作用的名称，只是为了使代码对人类更具可读性。

但是，根据现在设置font-family在a元素上的其他 CSS 代码，您可能需要使用更具体的选择器或说明!important符，或两者兼而有之。