php - 字体粗细不一致？

Question

编辑:我真的很抱歉，我认为我犯了一个错误。现在它正在按预期工作。当我使用 div 而不是 span 时，问题就出现了。我以为我更改并更新了代码，但显然我没有:(

我是 HTML5/CSS 的新手，刚开始接触它。今天我遇到了一个关于 font-weight 的问题(我使用的是网络字体)。我的 PHP 代码如下所示:

echo '<p><strong>'.$name$.'</strong>, You made a reservation at <strong>'.$date.'</strong></p>'

并且我已将 CSS 设置为(CSS 重置后):

h1, p, input, table {
    font-family: "Noto Sans KR", serif;
    font-weight: 300;
}

p {
    font-size: 12pt;
    line-height: 180%;
}

strong {
    font-weight: 500;
    white-space: nowrap;
}

然后一切正常。 strong 标签内的文本看起来很粗。然后我尝试在 $name 中应用省略号，所以我将 PHP 代码更改为:

echo '<p><span class="inform-name ellipsis"><strong>'.$name.'</strong></span>, You made a reservation at <strong>'.$date.'</strong></p>'

并将 CSS 设置为:

.inform-name {
    display: inline-block;
    max-width: 18em;
}

.ellipsis {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

突然 strong 标签内的文本看起来不再是粗体了。但是 strong 标签仍然适用。当我将 font-weight 更改为 800 之类的值时，文本再次显示为粗体，但 strong 中的其他文本(p 之外)看起来更加粗体更厚。

将 span 标签放在 p 标签内会改变什么吗？我不明白这里发生了什么，我尝试搜索但找不到有关此问题的任何信息。有谁知道为什么会这样以及如何解决？非常感谢任何帮助。

Answer 1

所以，我不太确定这是否是您正在寻找的，但这里有一个可能会帮助您解决问题的解决方案

首先我声明了两个变量 $name 和 $date

然后我删除了 span 标签。

这是代码:

PHP:

$name = 'John Johnson';
$date = '09-09-09';

echo '<p class="inform-name ellipsis"><strong>'.$name.'</strong>, You made a reservation at <strong>'.$date.'</strong></p>';

?>

CSS:

<style>
    .inform-name {
    display: inline-block;
    max-width: 18em;
}

.ellipsis {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

    h1, p, input, table {
    font-family: "Noto Sans KR", serif;
    font-weight: 300;
}

p {
    font-size: 12pt;
    line-height: 180%;
}

</style>

这是我从代码中得到的: