在这个片段中，我们将演示如何在 HTML 中禁用自动换行。
实际上，这可以使用一些 CSS 属性通过几个步骤来完成。
为了防止文本换行，我们可以使用带有“nowrap”或者“pre”值的 CSS white-space 属性。
在此代码中，我们可以看到包含它们的示例。
添加 CSS
- 将 <div> 元素的 white-space 属性设置为“nowrap”。
div {
white-space: nowrap;
}
现在，让我们看看结果。
使用 white-space 属性的“nowrap”值禁用自动换行的示例：
<!DOCTYPE html>
<html>
<head>
<title>文档的标题</title>
<style>
div {
white-space: nowrap;
border: 1px solid #cccccc;
}
</style>
</head>
<body>
<h2>Example</h2>
<div>
生活终归还得继续。.生活终归还得继续。. 生活终归还得继续。. 生活终归还得继续。.生活终归还得继续。. 生活终归还得继续。. 生活终归还得继续。. 生活终归还得继续。.
</div>
</body>
</html>
使用 white-space 属性的“pre”值禁用自动换行的示例：
<!DOCTYPE html>
<html>
<head>
<title>文档的标题</title>
<style>
div {
white-space: pre;
}
</style>
</head>
<body>
<h2>Example</h2>
<div>
生活终归还得继续。.生活终归还得继续。. 生活终归还得继续。. 生活终归还得继续。.生活终归还得继续。. 生活终归还得继续。. 生活终归还得继续。. 生活终归还得继续。.
</div>
</body>
</html>
创建 HTML
- 使用 <h2> 元素并添加 <div> 元素。
<h2>Example</h2> <div> 生活终归还得继续。.生活终归还得继续。. 生活终归还得继续。. 生活终归还得继续。.生活终归还得继续。. 生活终归还得继续。. 生活终归还得继续。. 生活终归还得继续。. </div>
日期：2020-06-02 22:15:08 来源：oir作者：oir