Javascript 修复由于HTML中的字体大小而导致的异常换行？_Javascript_Html_Css

Javascript 修复由于HTML中的字体大小而导致的异常换行？

javascript html css

Javascript 修复由于HTML中的字体大小而导致的异常换行？,javascript,html,css,Javascript,Html,Css,以下是源代码： <html> <head> <meta content="width=472" name="viewport"> <style type="text/css"> img {max-width:100%;} div { margin-top: 0;margin-bottom: 0;font-family:Arial, sans-serif;}p{margin-top: 0;m

以下是源代码：

<html>
<head>
<meta content="width=472" name="viewport">
<style type="text/css">
img {max-width:100%;} div { margin-top: 0;margin-bottom: 0;font-family:Arial, sans-serif;}p{margin-top: 0;margin-bottom: 0;word-wrap:break-word;}table{border-collapse: collapse;}td{word-wrap:break-word;font-family:Arial;vertical-align:top;}
</style>
<style media="screen" type="text/css">
.bumpedFont16 { font-size:1.6em; }.bumpedFont20 { font-size:2.0em; }
</style>
</head>
<body>
<div style="width:472;background-color:#FFFFFF; position:relative; overflow:hidden;word-wrap:break-word;min-height:830px; padding-left:20;padding-right:20;padding-top:20;padding-bottom:20;">
<style type="text/css">
.s0 {font-size: 17;font-family: Courier;color: rgb(0,0,255);}
.s1 {font-size: 17;font-family: Courier;color: rgb(163,21,21);}
.s2 {direction:ltr;text-align: left;}
</style>
<p class="s2">
<span class="s0">
<span class="bumpedFont16">Testing.</span>
</span>
<span class="s1">
<span class="bumpedFont16">This is a Testing well.</span>
</span>
</p>
</div>
</body>
</html>


img{max-width:100%；}div{margin-top:0；margin-bottom:0；字体系列：Arial，无衬线；}p{margin-top:0；margin-bottom:0；换行符：break-word；}表格{border-collapse:collapse；}td{word wrap:break-word；字体系列：Arial；垂直对齐：top；}
.bumpedFont16{font size:1.6em；}.bumpedFont20{font size:2.0em；}
.s0{字体大小：17；字体系列：Courier；颜色：rgb（0,0255）；}
.s1{字体大小：17；字体系列：Courier；颜色：rgb（163,21,21）；}
.s2{方向：ltr；文本对齐：左；}

测试。
这是一口试井。

这就是HTML代码的样子：

这就是我想要的：

如何编写通用javascript/css以避免文本换行？谢谢。

您可以将属性与

nowrap

值一起使用：

折叠空白，但不显示换行符（文本）包装）在文本中

你的段落：

p.s2 {
    white-space: nowrap;
}

此外，我建议您使用外部CSS，而不是使用多个内部CSS

断线没有异常；这是正常的包装。这是由于您为元素设置了固定的宽度，并且在CSS设置中，如果没有包装，元素中的内容就不适合

因此，您需要决定是否删除或增加宽度设置，减小字体大小，或者强制内容保持在同一行（例如@Felix建议的方式），即使这意味着内容溢出了元素。

我的答案对您有用吗？