單詞之間的控制中斷點

我有一個包含文本的響應頁面。有時，休息會出現在影響意義或設計的陌生地方。我可以控制句子可以打破的地方嗎？單詞之間的控制中斷點

例如，在這個簡化的例子中，我可以讓它只在句子結尾處中斷嗎？我的意思是如果窗口大於500px，所有的句子都會沒有間斷。如果窗口小於500px，則會在每個句子的結尾處顯示中斷。

CSS：

#text { 
    margin:0 auto; 
    width:100%; 
    max-width:500px; 
}

HTML：

<div id="text"> 
    This is the first sentence. This is the second sentence. This is the third. 
</div>

2013-07-27 Nrc

使用'
'標籤 –

我覺得這不是那麼簡單嗎？我認爲關鍵在於它只在需要時纔會中斷？ –

@Artur關鍵是你如何控制只有CSS的
。那
不能總是存在 – Nrc

您可以使用white-space: pre;

另一種方法是把它們看作塊

2013-07-27 10:25:56 John

有關'white-space'屬性的可能值的更多信息，請參閱：http://www.w3schools.com/cssref/pr_text_white-space.asp –

@John我沒有看到你的小提琴的作品。也許我沒有解釋清楚。文本應該是連續的，只有當窗口小於paragraf時纔會顯示爲 – Nrc

@Nrc我提供了另一個示例 – John

輸入一個不間斷空格 -   - 只要你不想這句話打破。

2013-07-27 11:24:35

這是針對特定情況的一個很好的解決方案。但總的來說，如果你想在所有尺寸如此之大的設備上工作，那麼當你有很多文本時，這可能會很瘋狂。即使在我的小例子中，我也要投入很多這裏是：http://jsfiddle.net/SuJyN/無論如何，它的工作原理是一個聰明的解決方案。謝謝！ – Nrc

#text { 
    margin:0 auto; 
    width:100%; 
    max-width:500px; 
    white-space: pre; 
}

2013-07-27 11:27:00 akash

如果你也想在那裏休息發生內字（連字符）在控制，您可以添加軟連字符：

super&shy;cali&shy;fragilistic&shy;expiali&shy;docious

...或使用腳本像hyphenator.js做那對你。

2013-07-27 11:29:12

回答