css怎么设置显示一行 _html编纂器sublimeText

html网页建造中，文本要一行显示是经常碰到的问题，下面是解决的方式。

需要这些哦
html编纂器sublimeText
方式/
1起首打开html编纂器sublimeText，如下图

文章插图

2正常解决思绪：设定文本长度，文本一行显示，多出的埋没或者省略号显示。
操纵的css属性white-space:nowrap;，如下图

文章插图

3操纵的css属性word-break:keep-all;，如下图

文章插图

4下面是具体的代码操作，如下图

文章插图

5最总例子显示结果，如下图
例子一没有利用以上说的2个css属性：呈现换行结果
例子二利用以上说的2个css属性：没有换行结果

文章插图

6最后附上全数代码，复制到html编纂器中就能实现结果
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
*{margin:0;padding: 0; }
.wrap1,.wrap2{width: 200px;border:1px solid #000000;
margin:0 auto;margin-bottom: 20px;}
.wrap1{
word-wrap: break-word;
}
.wrap2{
white-space:nowrap;
word-wrap: break-all;
}
</style>
</head>
<body>
<p>111111111111111111111111111</p>
<p>22222222222222222222222222222</p>
</body>
【css怎么设置显示一行】</html>

注重事项但愿对你有帮忙

以上内容就是css怎么设置显示一行的内容啦，希望对你有所帮助哦！