如何用CSS一個一個地分開單詞

Question

我想用css逐個單詞不用<br />而沒有width define並且沒有ul li基本上我想用h2標籤。

我想是這樣的： -

患者
圖
日曆

明白我的嘗試： -

<h2 style="word-break: break-all; ">Patient Chart Calendar</h2>

任何人都可以做到這一點？ 感謝

Answer 1

你可以是一個有點哈克與在word-spacing屬性：

<h2 style="word-spacing: 100vw;">Patient Chart Calendar</h2>

Answer 2

您可以使用<p>段落標記喜歡這 -

<p> 
<h2 >Patient</h2> 
</p> 
<p> 
<h2 >Chart</h2> 
</p> 
<p> 
<h2 >Calendar</h2> 
</p> 

沒有CSS需要.. :)

Answer 3

h2 { 
 
    word-spacing: 999999px; 
 
}

<h2>Patient Chart Calendar</h2>

Answer 4

或使用/ *非標準的WebKit */ 字突破：打破字;修改器：

<p style="word-break: break-word"> 
<h2 style="word-break: break-word"> 

Chrome，Safari和其他WebKit/Blink瀏覽器支持非正式的分詞值。

見How to mimic word-break: break-word; for IE9, IE11 and Firefox上支持IE

Answer 5

PLZ嘗試這個

<h2 style="display: table-caption;">Patient Chart Calendar</h2>