CSS - 样式不继承属性

问题描述：

我有这个代码，我不明白为什么我的H1和它的关联P标签没有得到在BODY CSS元素中定义的字体和大小（没有继承）..除非我取消注释* css风格，什么是一个非常糟糕的主意。如果我这样做了，我不能改变它们在Pss标签中重新定义它们的属性（继承似乎是被迫的）。CSS - 样式不继承属性

我对maaany标记有这个问题，我不想每次重新定义字体和大小。

global.css中

/* 
* { 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 12px; 
} 
*/ 
html { 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 12px; 
} 

body { 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 12px; 
    margin: 0px; 
} 

p { 
    text-align:justify; 
    margin:0px; 
    margin-bottom:10px; 
}

HTML

<HTML> 
<HEAD> 
<TITLE>a</TITLE> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<LINK href="global.css" rel="stylesheet" type="text/css"> 
</HEAD> 
<BODY> 
<DIV> 
    <TABLE width="100%" border="0" cellspacing="0" cellpadding="0"> 
    <TR> 
     <TD width="1" valign="top"></TD> 
     <TD valign="top"> 
     <div> 
      <H1>Title</H1> 
      <p>Some text</p> 
     </div> 
     </TD> 
    </TR> 
    </TABLE> 
</DIV> 
</BODY> 
</HTML>

您只是将字体大小添加到body标签。不是实际的h1标签。你需要用你想要的尺寸来定义h1标签，或者在样式页面中取消注释你的*样式。 – ZombieCode

答

H1默认已与它在浏览器在默认情况下，你可以使用一个复位样式表相关的字体大小来解决这或简单地。

h1,p{ 
font-size:12px;}

答

H1和P都具有原生浏览器定义的样式，这与默认的浏览器样式不同。没有任何造型信息，H1看起来与正文中的文字不同，对吧？由于这些原因，你需要明确地覆盖它们。

html, h1 { 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 12px; 
}

答

浏览器的用户样式风格h1和p，以及单独的所有其他元素，它具有比通过body更高的特异性。

单独设置样式以覆盖这些样式。

h1, p { 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 12px; 
    margin: 0px; 
}

您还可能有兴趣在一个CSS reset。

答

H1元素不会继承font-size，因为它在浏览器的默认样式表中设置了font-size。

P元素不会继承它，因为元素位于表格单元格中，并且浏览器中的“怪癖模式”意味着除了许多其他事情之外，表格会破坏继承。您的页面以怪癖模式显示，因为它没有文档类型声明;把<!doctype html>在最开始是为了避免怪癖模式最简单的方法，但是很多网页依靠怪癖模式和垮掉的“标准模式”。

如果取消对第一条规则，它使用通用选择*，它将应用于所有元素，但将被样式表中的任何其他规则覆盖，例如p { font-size: 5px }。如果看起来不是这种情况，那么在其他规则中有一个错误 - 使用W3C CSS Validator来首先检查语法。

CSS - 样式不继承属性

相关推荐