Html:em标记字符溢出错误

html中的字符溢出问题是否有解决方法？这仅在有背景色且斜体（em）标记用于简单文本时可见

在图片背景中查找“i”字符。“i”不适合背景，部分内容溢出到右侧

代码：

aaaaa Hijyen bariyeri，aaaaaaaaa

这是一个功能，而不是一个bug。例如，元素的框（即设置背景色时的颜色）的确定方式不考虑斜体字母的倾斜。您可以通过设置正确的填充来处理这个问题，正如@MarcB在一篇评论中所建议的那样，但是有一些复杂的情况。首先，所需的填充量不仅取决于字体大小（这种依赖性可以使用

em

单元处理），还取决于特定的字体。倾斜角度因字体设计的不同而变化很大，字符的形状也是如此，例如，倾斜的“f”比倾斜的“e”影响更大。第二，当你在一个字母后面加上空格和标点符号时，就像在本例中一样，单词和符号会以一种令人不快的排版方式分开

因此，我建议您在元素中包含标点符号；这看起来可能不合逻辑（逗号不是强调表达式的一部分），但在排版上已经足够了。通常，这足以解决问题。例如：

Özetle <em style=
"color:#ff0000; background-color:#c3ddfc;"
>hijyen bariyeri,</em> hiye

Özetle <em style=
"color:#ff0000; background-color:#c3ddfc; padding-right: 0.2em"
>hijyen bariyeri</em> hiye

Özetle hijyen bariyeri，你好

如果斜体字没有标点符号，而是一个正常的单词空间，考虑设置正确的填充大约0.2EM，但在测试之后决定特定值。例如：

Özetle <em style=
"color:#ff0000; background-color:#c3ddfc;"
>hijyen bariyeri,</em> hiye

Özetle <em style=
"color:#ff0000; background-color:#c3ddfc; padding-right: 0.2em"
>hijyen bariyeri</em> hiye

Özetle hijyen bariyeri hiye

---

值0.2em通常适用于诸如Arial之类的字体。对于没有斜体字体的字体，强制浏览器生成“假斜体”，可能需要0.3em这样的值，因为这种合成倾斜（在您的示例中可能会应用）使用大的倾斜角度来弥补真正斜体的不足。对于衬线字体，例如Cambria或Times New Roman，0.1em可能足以容纳大多数字符。

也许

右键填充：1em

？如果字体大小改变了怎么办？无关紧要

em

与字体大小有关。它总是“使用的字体/大小的

M

”的宽度。我认为您可以将其设置为内联块并使用padding或使用@MarcB，

em

等于字体大小，但它远没有接近“M”的宽度（只需测量“M”的宽度即可看到这一点）。而

1em

的填充对于这个目的来说太多了。