Question

两个CSS设置：

h6 {
  font-size: 18px;
  color: #000;
  font-weight: 400;
  letter-spacing: 0.05em;
}

h6red{
 font-size: 18px;
 color: #ff0000;
 font-weight: 400;
 white-space: nowrap;
}

<h6red>LE CHIC</h6red><h6> jouw partner in kleur</h6>

输出是两行，我可以阻止它吗？

提前致谢

欧文

Answer 1

<h6red>无效标记。但你要找的是展示。将display:inline-block;添加到上述两个版本中，它们将保持一行。

Answer 2

如Marc Audet所述，<h6red>不是有效的HTML，因此我们应该从那里开始。标题标记为<h1>，<h2>，<h3>，<h4>，<h5>和<h6>，除了数字更改之外没有其他变体。数字越小，文本越大。其他任何东西都不会被浏览器正确读取为标题。

话虽如此，这就是我要做的事。

使用<span>标记，您可以隔离（或“包装”）句子中的一个单词并装饰CSS中的<span>。这将在添加样式时保持文本内联。我的建议是在<span>上使用一个类名，以便以后允许它用于不同的事情，除非你只计划使用一次。我建议：

<h6>
  <span class="makeRed">LE CHIC</span>jouw partner in kleur
</h6>

以及这个CSS：

h6{
 font-size: 18px;
 color: #000;
 font-weight: 400;
 letter-spacing: 0.05em;
}

.makeRed{
  color: #f39999;
}

html将文字与不同的字体

2 个答案: