html - 在css中设置多个段落样式

Question

这是一个顶级问题，更多的是基于我对 css 的无知。我正在尝试在 css 中创建两种段落样式，一种字体大小为 20px，另一种字体大小为 14px。但是，无论我做什么，字体都是一样的。附件是我现在正在做的事情的一个例子，如果有人能指出我的解决方案，我将不胜感激。为了简洁起见，我省略了不必要的代码。

html代码是这样的

<p>This is the html section with 20 px font</p>

<p class="new_font"> This is the html section with 8px font</p>
/* I have also tried this with a <div class="new_font"> and and <p id="new_font>"*/

css代码是这样的

p {
     /*text-indent: 1.5em;*/
     font: 20px Helvetica, Sans-Serif;
     color: white;
     overflow: hidden;
     padding: 15px;
     text-align: justify;
     background: rgb(0, 0, 0,0.3); /* fallback color */
     background: rgba(0, 0, 0, 0.7);
}
p new_font {
     /*text-indent: 1.5em;*/
     font: 14px Helvetica, Sans-Serif;
     color: white;
     overflow: hidden;
     padding: 15px;
     text-align: justify;
     background: rgb(0, 0, 0,0.3); /* fallback color */
     background: rgba(0, 0, 0, 0.7);
} 

Answer 1

您的 CSS 无效，这就是它不适用的原因:

p new_font {
   /* ... */
}

应该写成

p.new_font {
   /* ... */
}

p new_font 用英语读作“选择位于 p 标签内的所有 new_font 标签”。

p.new_font 用英文读作“选择所有 p 标签，其 class 属性设置为 new_font”