Question

我正在尝试创建一个网站，我想知道如何更改段落中文本的大小。我希望第1段比第2段更大。只要它更大，无论多大，都无关紧要。我该怎么做？

我的代码如下：

<html>
<head>
<style>
  p {
    color: red;
  }
</style>
</head>
<body>
<p>Paragraph 1</p>
<p>Paragraph 2</p>
</body>
</html>

Answer 1

给他们一个班级，并将你的风格添加到班级。

<style>
  p {
    color: red;
  }
  .paragraph1 {
    font-size: 18px;
  }
  .paragraph2 {
    font-size: 13px;
  }
</style>

<p class="paragraph1">Paragraph 1</p>
<p class="paragraph2">Paragraph 2</p>

选中 EXAMPLE

Answer 2

或者在线添加样式：

<p style="font-size:18px">Paragraph 1</p>
<p style="font-size:16px">Paragraph 2</p>

Answer 3

如果您只想增加任何文档的第一段的字体大小，即在线出版物使用的效果，那么您可以使用第一个子伪类来实现所需的效果。

p:first-child
{
   font-size:   115%; // Will set the font size to be 115% of the original font-size for the p element.
}

但是，这将改变作为任何其他元素的第一个子元素的每个p元素的字体大小。如果您对设置body元素的第一个p元素的大小感兴趣，请使用以下内容：

body > p:first-child
{
   font-size:   115%;
}

以上代码仅适用于作为body元素子元素的p元素。

Answer 4

如果你想在不增加课程的情况下这样做......

p:first-child {
    font-size: 16px;
}

p:last-child {
    font-size: 12px;
}

或

p:nth-child(1) {
    font-size: 16px;
}

p:nth-child(2) {
    font-size: 12px;
}

Answer 5

您无法在HTML中执行此操作。你可以在CSS中。创建一个新的CSS文件并写：

p {
 font-size: (some number);
}

如果这不起作用，请确保没有任何＆＃34; pre＆＃34;标签，使您的代码更小。

Answer 6

您可以通过在段落标记中设置样式来实现。例如，如果您想将字体大小更改为28px。

<p style="font-size: 28px;"> Hello, World! </p>

您还可以通过以下方式设置颜色：

<p style="color: blue;"> Hello, World! </p>

但是，如果您想预览字体大小和颜色（建议这样做），然后再将其添加到网站并使用它们。我建议事先进行测试，以便选择与背景形成鲜明对比的良好字体大小和颜色。如果您希望这样做，我建议您使用此站点，但找不到其他任何内容：http://fontpreview.herokuapp.com/

如何在html中更改字体大小？

6 个答案: