在 CSS3 中,我們可以使用word-wrap
和word-break
屬性來控制英文文本的換行。
/* 設置單詞內部可以換行 */
word-wrap: break-word;
/* 設置可以在單詞中間換行 */
word-break: break-all;
word-wrap
屬性用于指定單詞內部是否可以被斷開換行。當設置為break-word
時,單詞可以被分成多行來適應容器的寬度。
而word-break
屬性則用于控制是否可以在單詞中間斷行。當設置為break-all
時,則可以在單詞中間斷行,以適應容器的寬度。
/* 設置單詞內部不可以換行 */
word-wrap: normal;
/* 設置不能在單詞中間換行 */
word-break: keep-all;
當然,你也可以將word-wrap
設置為normal
,表示單詞內部不可以被斷開換行。而將word-break
設置為keep-all
,表示不可以在單詞中間斷行。
使用 CSS3 的這些屬性,我們可以更加靈活地控制英文文本在不同容器中的換行方式,提升頁面排版的美觀程度。
下一篇php 5 php7