如何在 HTML 中允许封闭文本不换行?

htmlweb developmentfront end technology更新于 2025/8/14 5:00:17

为了允许封闭文本不换行,我们将使用 <nobr> 标签创建单行文本,它不关心语句的长度。如果我们想要阅读全文,则必须使用水平滚动条。这与 <br> 换行标签完全相反。HTML5 不支持 <nobr> 标签。此标签不包含任何属性,它包含一个打开和关闭的标签。

HTML 中的 <nobr> 标签

HTML <nobr> 标签用于指示浏览器不要断开指定的文本。它与 <wbr> 标签一起使用,<wbr> 建议扩展浏览器何时可以在原本不可断开的文本序列中插入换行符。

与始终会导致换行的 <br> 标签(即使在带有 <nobr> 标签的片段中也如此)不同,<wbr> 标签仅当放置在带有 <nobr> 标签的内容片段内时才有效,并且仅当当前行已超出浏览器显示窗口边距时才会导致换行。

语法

以下是 HTML 中 <nobr> 标签的语法 −

<nobr> Statement </nobr>

示例

以下示例演示了 HTML 中 <nobr> 标签的用法 −

<!Doctype html>
<html>
<head>
   <title>nobr Tag in HTML</title>
   <style>
      h1 {
         color: blue;
      }
   </style>
</head>
<body>
   <center>
      <h1>TutorialsPoint</h1>
      <h4>HTML nobr tag</h4>
      <nobr> Tutorials Point is a leading Ed Tech company striving to provide the best learning material on technical and non-technical subjects. </nobr>
   </center>
</body>
</html>  

示例

以下是 HTML 中 <nobr> 标签的另一个示例 −

<!DOCTYPE html>
<html>
<head>
   <title>HTML nobr Tag</title>
</head>
<body>
   <nobr>This is a very long sequence of text that is forced to be on a single line, even if doing so causes <wbr /> the browser to extend the document window beyond the size of the viewing pane and the poor user must scroll right <wbr /> to read the entire line. </nobr>
</body>
</html>

示例

在下面的例子中,我们尝试限制封闭文本中的断行 −

<!DOCTYPE html>
<html>
<head>
   <title>nobr Tag Demonstration</title>
   <style>
      p.a {
         white-space: nowrap;
      }
   </style>
</head>
<body>
   <h1>Using CSS property white-space</h1>
   <p class="a"> It is a very long text which is very inconvenient to read, as it is written in one line, and you have to scroll horizontally to read it. </p>
</body>
</html>

相关文章


有用资源