html/css 中文本后的间距答案

【问题标题】：Spacing after text in html/csshtml/css 中文本后的间距
【发布时间】：2021-01-25 11:22:11
【问题描述】：

所以我不知道为什么添加padding 甚至margin 不会在文本之后创建额外的空间。

输出：

我想在 Stay Tuned 文本之后添加空格，我尝试添加 padding 和 margin，但它仍然不起作用。似乎是什么问题？有什么建议吗？

该文本的代码：

@import url('https://fonts.googleapis.com/css?family=Montserrat');
body {
    background: transparent;
}

.title123 {
    font-family: "Montserrat";
    text-align: center;
    color: #FFF;
    letter-spacing: 1px;
}

h23 {
    background-image: url(https://media.tenor.com/images/ad3dbde6dd7863faeb8151178df7bc71/tenor.gif);
    color: transparent;
    -moz-background-clip: text;
    -webkit-background-clip: text;
    text-transform: uppercase;
    font-size: 35px;
}
/* styling my button */

<link rel="stylesheet" href="assets/css/text.css">  
          <div class="title123">
 <h23>Stay Tuned!</h23>
 </div>

【问题讨论】：

尝试添加display: inline-block

标签： javascript html css animation css-animations

【解决方案1】：

填充和边距适用于 block 元素。您需要将 h23 元素设置为块元素 - 因为它不是已知的 HTML 元素，默认情况下它呈现为内联。

你根本不应该使用它......但如果你真的想要的话，你可以使用它——只要你需要填充或边距，让它 block 或 inline-block 在你的 CSS 中添加这样的规则：

h23 {
  display: inline-block;
}

【讨论】：

【解决方案2】：

h23 不是 HTML 元素。标题标签是h1-h6。如果您将其更改为<h2>，它将起作用。然后你可以添加一个类并定位它。

<h2 class="h23">Stay tuned!<h2>

然后在你的css文件中

.h23 {
    margin-bottom: 1rem;
}

【讨论】：