在CSS中如何更改h1和h2的字体大小

ewm0tg9j 于 2023-01-27 发布在其他

关注(0)|答案(6)|浏览(258)

在一个WordPress的2011主题中。我想改变标题的大小当我把我的标题围绕h1和h2标签如下

<h1>My h1 heading </h1>
<h2> My h2 heading </h2>

我使用的主题标题的字体大小几乎和内容的字体一样，除了它们是粗体。所以我的标题不是很突出。
我想我需要在CSS文件中做一些改变。请告诉我到底需要放些什么。

css

来源：https://stackoverflow.com/questions/10668056/in-css-how-do-you-change-font-size-of-h1-and-h2

6条答案

按热度按时间

rbl8hiat1#

h1 {
  font-weight: bold;
  color: #fff;
  font-size: 32px;
}

h2 {
  font-weight: bold;
  color: #fff;
  font-size: 24px;
}

请注意，在颜色之后，您可以使用单词（例如white）、十六进制代码（例如#fff）或RGB（例如rgb(255,255,255)）或RGBA（例如rgba(255,255,255,0.3)）。

赞(0）回复(0）举报 2023-01-27

mxg2im7a2#

h1 { font-size: 150%; }
 h2 { font-size: 120%; }

根据需要进行调整。

赞(0）回复(0）举报 2023-01-27

zpgglvta3#

你试过什么了？这个应该管用。

h1 { font-size: 20pt; }
h2 { font-size: 16pt; }

赞(0）回复(0）举报 2023-01-27

kqlmhetl4#

如果你想改变一个具体的标题，这是一个更容易的解决方案

<style>
    h1.increase {
       font-size: 15px;
}
</style>

<h1 class="increase">Header</h1>

赞(0）回复(0）举报 2023-01-27

mlmc2os55#

如果只更改字体大小，文本可能会在较小的设备类型上交叉。

<style>
.heading-1{
  font-size: 350%!important;
}
</style>

<h1 class="heading-1">
  Get in Touch
</h1>

要使其响应迅速，也可以考虑调整行高。

<style>
.heading-1{
  font-size: 350%!important;
  line-height: 120%!important;
}
</style>

<h1 class="heading-1">
  Get in Touch
</h1>

赞(0）回复(0）举报 2023-01-27

zrfyljdw6#

你可以使用Bootstrap CSS快速实现。

<!DOCTYPE html>
    <html lang="en">

    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Larger Heading</title>
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" />

    </head>

    <body>
        <main>
            <h1 class="display-1">Display 1</h1>
            <h1 class="display-2">Display 2</h1>
            <h1 class="display-3">Display 3</h1>
            <h1 class="display-4">Display 4</h1>
            <h1 class="display-5">Display 5</h1>
            <h1 class="display-6">Display 6</h1>
        </main>
    </body>

    </html>

赞(0）回复(0）举报 2023-01-27

我来回答

在CSS中如何更改h1和h2的字体大小

6条答案

相关问题

热门标签

最新问答