Question

我正在将CSS应用于我的页面框，其中可能包含<div> <table> <p>和其他元素，以及纯文本。

我希望所有文字都是相同的字体大小，但<h1> <h2> <h3>

等标记中的文字除外

使用objectid“mybox”我的简单CSS字体修饰符是

.mybox * {
font-size: 13px;
}

问题是，这也为任何<h2>元素设置了字体，依此类推。我可以在我的<h2>元素和另一个选择器中添加一个类来重新覆盖字体大小，但感觉非常倒退。

有什么好办法可以解决这个问题？

我找到了适用于类的not（）选择器，但我找不到像<h2>这样的html元素来将它们从我的“全局”字体修饰符中排除。

Answer 1

将:not选择器与“不需要的”元素一起使用：

.mybox *:not(h1):not(h2):not(h3) {
  font-size: 13px;
}

<div class="mybox">
  <h1>foo</h1>
  <h2>bar</h2>
  <h3>Hans</h3>
  <label>Gruber</label>
  <p>Goku</p>
  <div>Yoda</div>
</div>

JSFiddle

Answer 2

您可以在body上设置字体样式，并添加:not(h1):not(h2)以不包含样式。

Answer 3

在body中设置所需的文字大小，然后在标题中设置所需的文字大小：

body{
  font-size: 16px;
}

h1{
  font-size: 50px;
}

h2{
  font-size: 35px;
}

<p>text</p>
<h1>header 1</h1>
<h2>header 2</h2>

Answer 4

与其他建议人员一样，主要有两种方法可以做到这一点，方法是在onPostExecute和asyncTask标记中添加:not选择器，或者只是为这些标记添加单独的字体 - 大小

h1

或者，我会做的是利用CSS级联性质。这意味着您为元素提供的任何属性都会覆盖您可能提供给它的任何先前属性。所以这是如何做到的：

h2

此处，首先声明.mybox:not(h1):not(h2) { font-size: 14pt; }属性，然后声明body { font-size: 12pt; } .mybox h1 { font-size: 18pt; } .mybox h2 { font-size: 16pt; }和body标记非常重要。

设置除<h1> </h1> <h2>等所有文本的字体大小

4 个答案: