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怎么設置顯示一行的內容啦，希望對你有所幫助哦！

css怎么設置顯示一行

猜你喜歡