HTML 符号限制文本的高度

Question

显然我做错了什么 - 当我试图在单词前放置 HTML 符号时，下一个单词的高度，没有 HTML 符号，具有不同的高度，并且不在同一条线。

Answer 1

<div class="a"><h1>&#9785;123-456-789text 2017</h1>

试试这个，我认为它会起作用

Answer 2

问题出在 symbol 的默认大小上。如果设置符号的大小，就不会出现问题。看看下面的代码：

.a {
    display: flex;
}
h1 {
    text-transform: uppercase;
}
span.symbol {
    font-size: 26px;
}

<div class="a">
    <h1><span class="symbol">&#9785;</span>123-456-789</h1>
    <h1>text 2017</h1>
</div>

简而言之：

将符号包裹在 span 内并设置其字体大小。

span.symbol {
    font-size: 26px;
}

HTML symbol brakes height of text