Asp.net mvc 如何更改句子部分的格式？

我的观点是这样的：

<div class="contact">
 <h6>@Model.Salutation</h6><h3>@Model.FirstName @Model.LastName</h3>
</div>

---

但是我在Mr和rest之间有一个换行符，我该怎么办？

默认情况下，所有的h*都是块元素，只是意味着它们将占据容器的整个宽度，将东西推到容器的左右

尝试将显示：内联添加到h6和h3

.contact h6, .contact h3 { display:inline }

h3和h6都是，因此要么将两者的

display

属性更改为

inline

（我不建议这样做），要么将标记更改如下：

<div class="contact">
 <h3><span class="salutation">@Model.Salutation</span> @Model.FirstName @Model.LastName</h3>
</div>

@Model.saltation@Model.FirstName@Model.LastName

---

仅设置span元素的样式。

您有h6标记，然后是h3标记。我在想……这是真的标题吗？您使用标记是因为格式而不是意义吗

试着写：

<div class="contact">
 <span class="title">@Model.Salutation</span><span class="name">@Model.FirstName @Model.LastName</span>
</div>

如果您使用的是HTML5标记，那么您可能会包含信息并使用不同的标记。看看这个例子（刚刚用微数据更新）：

---

另一种可能性——如果关于“称呼”的信息在上下文中不是特别相关，但它只是用于引入名称以便可视化——是使用

伪元素

，并将这些信息放在那里，如下所示：

<div class="contact">
  <h3 data-salutation="@Model.Salutation">@Model.FirstName @Model.LastName</h3>
</div>

---

谢谢你的详细回答。不过我有一个问题。与普通HTML/CSS标记相比，使用HTML5标记的优势是什么？即使在HTML4中，也可以使用微数据的属性，在HTML5中，它们只是……标准。为什么HTML5更好？你应该为此发布一个新问题！更熟练的人会给你很多好的理由。在我看来，这是因为你回来使用HTML标签来解释语义而不是格式

.contact .title
{
 font-size: 0.85em;
 color: gray;
}

.contact .name
{
 font-size: 0.85em;
 font-weight: bold;
}

<div class="contact" itemscope itemtype="http://schema.org/Person">
 <span itemprop="title">@Model.Salutation</span>
 <span itemprop="name">@Model.FirstName @Model.LastName</span>
</div>

div[itemtype="http://schema.org/Person"] > span[itemprop="title"]
{
 font-size: 0.85em;
 color: gray;
}

div[itemtype="http://schema.org/Person"] > span[itemprop="name"]
{
 font-size: 0.85em;
 font-weight: bold;
}

<div class="contact">
  <h3 data-salutation="@Model.Salutation">@Model.FirstName @Model.LastName</h3>
</div>

.contact h3 {
  font-weight: bold;  
}

.contact h3:before {
   content: attr(data-salutation);
   padding-right: 1em;
   font-weight : normal;
}