web前端換行程式碼的幾種實現方式!
剛剛入門前端的小夥伴肯定有遇到過需要將一整段文字換行顯示的情況,其實有好幾種方式可以實現,小千今天就來給大家介紹幾種常見的方式。
1.首先第一種方式就是在想要換行的文字處新增一個 "<br>" 標籤即可,想換幾行就新增幾次程式碼即可。
2.使用<p>文字</p>程式碼,段落文字會自動換行,需要多少行就需要新增多少次<p>程式碼,注意這個程式碼需要有關閉項也就是</p>結尾,否則無法生效。
3.透過一些編輯器當你按下Enter鍵的時候編輯器會自動為你新增換行程式碼,例如Dreamweaver等等。
4.使用CSS樣式表進行文字的控制換行,中文和英文是不一樣的。
1)word-break:break-all.只對英文起作用,以字母作為換行依據
2)word-wrap:break-word. 只對英文起作用,以單詞作為換行依據
3)white-space:pre-wrap.只對中文起作用,強制換行
4)white-space:nowrap.強制不換行,都起作用
5)white-space:nowrap;overflow:hidden;text-overflow:ellipsis;不換行,超出部分隱藏且以省略號形式出現。
注意這裡的屬性都需要為容器設定寬度,否則是無法生效的。且word-break為IE5專有屬性,同學們要記住了。
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/31548651/viewspace-2765390/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- Web前端主題切換的幾種方案Web前端
- 程式碼迭代的幾種方式
- 簡單實現幾種常見的前端效果,附程式碼!前端
- Java建立多執行緒的幾種方式實現Java執行緒
- 實現 JavaScript 沙箱的幾種方式JavaScript
- Laravel 幾種少用的排序方式程式碼Laravel排序
- AOP 有幾種實現方式?
- 實現登入態的幾種方式
- java幾種代理模式的實現方式Java模式
- Android 截圖實現的幾種方式Android
- 分散式鎖的幾種實現方式~分散式
- 互動投影的幾種實現方式
- 實現微前端的十種方式 【第一種】前端
- 實現微前端的十種方式 【第二種】前端
- 分散式事務的幾種實現方式分散式
- css實現水平垂直居中的幾種方式CSS
- 【多執行緒高併發程式設計】二 實現多執行緒的幾種方式執行緒程式設計
- Linux shell:執行shell指令碼的幾種方式Linux指令碼
- 前端--實現隔行變色的兩種方式前端
- 【.NET 6】多執行緒的幾種開啟方式和程式碼演示執行緒
- 實現繼承的幾種方式及工作原理繼承
- 三欄式佈局的幾種實現方式
- 幾種實現延時任務的方式(一)
- web前端入門到實戰:30行前端程式碼實現任意文字轉粒子Web前端
- Web前端------JS高階繼承的實現方式Web前端JS繼承
- Spring在程式碼中獲取bean的幾種方式SpringBean
- 前端實現文字跑馬燈的三種方式前端
- 程式間的幾種通訊方式
- js實現繼承的幾種方式和對比JS繼承
- 小結:二叉樹的幾種實現方式二叉樹
- 確保某個BeanDefinitionRegistryPostProcessor Bean被最後執行的幾種實現方式Bean
- 突破Android P非SDK API限制的幾種程式碼實現AndroidAPI
- 負載均衡的幾種演算法Java實現程式碼負載演算法Java
- 一行程式碼實現微前端行程前端
- 執行緒池建立的幾種方式執行緒
- 前端基礎問題:CSS居中的幾種方式前端CSS
- css3實現動畫有幾種方式?CSSS3動畫
- css實現圖片自適應容器的幾種方式CSS