在div标签的同一行保留单独的文本

Question

我正在使用CSS将我的部分文本字体变为粗体。但我不希望整条生产线变得大胆。只是文本的一部分。我怎样才能做到这一点？这是我的代码：

HTML

<div>
   <div id="titleLabels">Revision:</div> 1.0 draft A
</div>

CSS

#titleLabels 
{
   font-weight: bold;
}

这个的输出是：

这不是我想要的。我希望＆＃34; 1.0草案A bit与说明Revision＆＃34;的位内联。

我该怎么做呢？

Answer 1

只需将display:inline添加到#titleLabels：

#titleLabels {
    font-weight: bold;
    display:inline;
}

<div>
    <div id="titleLabels">Revision:</div>1.0 draft A
</div>

默认情况下，Div是块级元素，除非你改变它，否则将占用其父元素的整个宽度。

更合乎逻辑的解决方案是不在修订文本上使用div，而是使用<strong>，<b>或<span>并使用font-weight样式。

#titleLabels {
  font-weight: bold;
}

<div>
  <b>Revision:</b>1.0 draft A
</div>
<div>
  <strong>Revision:</strong>1.0 draft A
</div>
<div>
  <span id="titleLabels">Revision:</span>1.0 draft A
</div>

Answer 2

使用display:inline-block

#titleLabels 
{
   font-weight: bold;
    display:inline-block;
}

<div>
   <div id="titleLabels">Revision:</div> 1.0 draft A
</div>

Answer 3

您可以使用<b>标记将某段文字设置为粗体

<div>
   <b>Revision:</b> 1.0 draft A
</div>