2015-10-19 68 views
1

我需要顯示標題,以便每當我們縮小屏幕尺寸時,它應該在第二行顯示多於單個單詞。針對不同屏幕分辨率的相關文字的分詞

例子:

實際契合瀏覽器

字歇在不同的屏幕分辨率

一個perticular文字應該在代表類似

字歇針對不同的相關文字

屏幕分辨率

不喜歡這個

字歇在不同的屏幕上perticular文本

分辨率

我嘗試使用<wbr>&shy;但沒能成功。

回答

1

您可以在文字屏幕分辨率之間插入&nbsp;。或者,你可以用在span元素中的兩個詞應用了white-space: nowrap;


例子:http://codepen.io/anon/pen/meqvGw

<p>Word Break at a perticular text for different 
    screen&nbsp;resolutions</p> 

<p>Word Break at a perticular text for different 
    <span style="white-space: nowrap;">screen resolutions</span><p> 

無論如何,我會去與後者的例子,因爲你可以可以消除通過mediaqueries該屬性在較小的視口上

+0

我們無法知道它佔據了多少空間。因此,可以向其添加多少個 我們不知道 –

+0

您要求在最後一行有多個單個單詞。所以單個非破壞空間就足夠了。 – fcalderan

+0

以簡單的方式解決。媒體查詢花費了很多時間 –