Question

我在自己的中有三个部分的文字，我需要在每个段落中加粗一两个单词。所以我的问题是如何正确地加粗“CLX Exchange Accommodators，Inc。”使用CSS而不使用下面的文本显示在粗体文本下方。我问这个的原因是因为无论何时我尝试在另一个div或p标签中隔离我想要加粗的文本，剩下的文本都会出现在粗体文本下面。

这是我的HTML

<div id="content">
   <p class="copy"> CLX Exchange Accommodators, Inc. have been proudly serving real estate investors nationwide since 1991.</p>

</div>
<!--End of content-->

这是我在codepen上的当前项目，如果它有助于http://codepen.io/Austin-Davis/pen/IpDLu。

Answer 1

要加粗段落中的某些文字，您可以使用，标记或带有样式集的。这些选项如下所示：

I want to <b>bold</b> a word.

This word is <strong>bolded</strong>.

The following word is <span style="font-weight: bold;">bolded</span>.

请注意，您选择的代码具有语义含义。随着HTML5的发展，有一种运动可以使您正在使用的标签带有意义，而不仅仅是将它们用于显示目的。 You can read a bit about a few of the relevant meanings here.

虽然我在上面的代码片段中使用了内联样式来设置该样式，但我可能会使用样式表在实际网页上设置样式。将HTML标记和样式分开是一种很好的做法。

哦，最后一件事：将文本放在p或div标签中将其移动到下一行的原因是因为默认情况下这些元素设置为display: block;。如果您想使用其中一个标记（出于语义原因不应该使用这些标记），可以将它们设置为display: inline;或display: inline-block;。 Read all about the display property here.

Answer 2

这可以通过STRONG标签实现，但我更喜欢使用SPAN保持灵活性。您可以在CSS中设置SPAN（或STRENC）的样式。

<style>
#content p.copy span {font-weight: bold;}
</style>
<div id="content">
<p class="copy"> <span>CLX Exchange Accommodators, Inc.</span> have been proudly serving real estate investors nationwide since 1991.</p>

</div>
<!--End of content-->

Answer 3

 <p class= "copy"> <b>CLX Exchange Accommodators, Inc.</b> have been proudly serving real estate investors nationwide since 1991.</p>

.copy b 
{
  font-weight:bold;
}

试试这个。

Answer 4

您是否有理由在CSS中执行此操作？最简单的方法是在CLX Exchange Accommodators，Inc。周围放置 标签

<div id="content">
   <p class="copy"> <b>CLX Exchange Accommodators, Inc.</b> have been proudly serving real estate investors nationwide since 1991.</p>

</div>
<!--End of content-->

您也可以使用 标记，但它也可能会使某些旧版浏览器中的文字用斜体显示

如何在不更改剩余段落</p>的格式的情况下将<p>标记中的文本隔离为粗体

4 个答案: