在我的网页上，我有一系列嵌套 div 中的弹出图像。在顶部 div 我有一个标题。当加载此图像的更高分辨率时，我在标题中显示表情符号沙漏 (\xe2\x8f\xb3)。完成后，我取下沙漏。当沙漏被移除时，带有标题文本的 div 会在垂直方向上变得更小。如何让表情符号与文本大小相等，这样它不会使我的 div 变高？
\n下面是一个代码片段，显示了一个具有青色背景颜色和表情符号的 div。单击按钮时，innerHTML 会替换为不带表情符号的文本，您可以看到垂直尺寸变小。
\ndocument.getElementById("button").onclick =\n () => {document.getElementById("div").innerHTML = "This is some text without emoji"};div.textWithEmoji {\n font-size : medium;\n background-color : cyan;\n}<!DOCTYPE html>\n<html lang="en">\n\n<head>\n <meta charset="UTF-8">\n <title>Emoji Size Test</title>\n</head>\n\n<body>\n\n<h1>Emoji Size Test</h1>\n\n<div class="textWithEmoji" id="div">\n This is some text with emoji \xe2\x8f\xb3\n</div>\n\n<br>\n\n<button id="button" type="button">Remove Emoji</button>\n\n</body>\n\n</html>我不想将 div 高度强制为特定值，因为字体大小是页面中的变量。
\n我尝试将表情符号的大小设置为 75%，这适用于 Chrome 和 iOS，但不能保证这适用于每个平台。
\n有什么想法可以让它做我想做的事吗？
\n谢谢，
\n麦克风 …