18

我正在尝试制作一个网站，我想知道如何更改段落中文本的大小。我希望第 1 段比第 2 段大。只要它更大，多少都没关系。我该怎么做呢？

我的代码如下：

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

6 回答 6

19

给他们上一堂课，并将你的风格添加到课堂上。

<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>

检查这个示例

于 2013-08-02T01:45:56.053 回答
11

或者内联添加样式：

<p style="font-size:18px">Paragraph 1</p>
<p style="font-size:16px">Paragraph 2</p>
于 2013-08-02T01:58:54.863 回答
7

如果您只是对增加任何文档的第一段的字体大小感兴趣，这是在线出版物使用的效果，那么您可以使用 first-child 伪类来实现所需的效果。

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 元素。

于 2013-08-02T02:32:43.533 回答
1

如果您想在不添加类的情况下执行此操作...

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;
}
于 2013-08-02T01:45:44.960 回答
0

你不能在 HTML 中做到这一点。你可以在 CSS 中。创建一个新的 CSS 文件并写入：

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

如果这不起作用，请确保您没有任何“pre”标签，这会使您的代码更小。

于 2017-10-30T15:41:19.887 回答
0

您可以通过在段落标签中设置样式来做到这一点。例如，如果您想将字体大小更改为 28px。

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

您还可以通过设置来设置颜色：

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

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

于 2020-01-02T15:24:59.517 回答