2013-01-22 47 views
2

我在這裏面臨一個問題:我在韓國十進制的Unicode文本及文本顯示在4列和多行(因爲它是一個語言測試的答案)。問題是因爲每個答案的寬度都是20%,所以當它不適合時,這個句子在詞的中間隨機分裂,而不是在單詞之間的空格中。我不知道如何處理這個問題,因爲這個文本是從數據庫中自動加載和顯示的。韓國句子被拆隨機

爲4列的每一個的HTML代碼是這樣的:

<table class="courses" border="0" cellpadding="2" cellspacing="2" width="100%" style="font-size:13px;"> 
    <tbody> 
    <td width="20%"> 
    <p align="center"> 
     <input name="a[X]" value=1" type="radio"> 
     <br> 
     <?php echo "&#48148;&#49240;&#47732; &#44032;&#51648; &#47560;&#49464;&#50836;" ?> // this comes from a DB, its the unicodes of the korean characters<br> 
    </p> 
    </td> 
</tbody> 
</table> 

我能做什麼來解決這個問題,當它不適合,避免分裂隨機的,但做到這一點時,句子結束?如果你注意到在Unicode代碼中,你可以告訴它之間有一個空格;면&#44032,但是它只是在任何地方打破,對於所有文本都是一樣的。

(請注意,沒有任何編碼問題,韓語字符的正常顯示。而且它不會與像瑞典或西班牙語等語言發生)。

編輯

這裏有一個working example

請注意,在該示例中,第一個答案被拆分爲最後兩個字符,當該單詞有五個字符時,應該先拆分3個字符。

+0

這是否發生在所有瀏覽器?我認爲這個問題可能是針對瀏覽器的,所以至少應該提及一些關於瀏覽器的問題。 – unwind

+0

該表所在的容器有多大?你的例子中有很少的字符。我沒有看到任何不自然/意外的休息。 – ryan

+0

它發生在Chrome和Firefox中,沒有機會用IE測試。 – Vika

回答

3

線打破了CJK(中國/日文/韓文)文字可以給出Web標準的現狀是相當有問題的。

沒有太多的事情可以用語言無關的方式來做; CSS級別3定義了related attributesline-breakword-break),但我不太確定現代瀏覽器支持的級別是什麼(顯然不是現代瀏覽器完全不在圖片中)。

+2

打我。作爲參考,關於[自動換行](http://en.wikipedia.org/wiki/Word_wrap#Word_wrapping_in_text_containing_Chinese.2C_Japanese.2C_and_Korean)的維基百科文章「在中文,日文和韓文中,每個漢字通常被認爲是一個詞,因此通常可以在任何漢字前後進行換行。「 – ryan

0

這聽起來像你剛剛遇到的white-space默認行爲。你可以看看CSS white-space屬性,並嘗試類似pre

+0

我剛剛嘗試過,但它不起作用,因爲使用pre(或類似的屬性)句子不會中斷,表格的寬度也會增長很多 – Vika

2

這並不重要,因爲無論如何韓國人都可以在任何地方分裂。從Chosun.com看到這個截圖:

enter image description here

的言語,不隨地切割,看似隨意。你不必擔心連字符。

0

我面臨着同樣的問題,我認爲最好的辦法是包裝的每個單詞的跨度white-space: nowrap;。這確保了單詞內部不會有任何換行符。

看到這個的jsfiddle的概念證明:http://jsfiddle.net/we7jx08r/。當你改變身體的寬度時,你會注意到換行總是正確的。

請參閱http://css-tricks.com/almanac/properties/w/whitespace/對於white-space: nowrap瀏覽器支持(IE5.5 +,FF1 +,Safari 1+)。

0

你可以嘗試的解決方案前一陣子我在工作:https://stackoverflow.com/a/46714474/2114953

也就是說,如果你喜歡使用JS以每個字包裝成跨度HTML元素,然後用CSS顯示:inline-block的到如果需要的話,強迫他們轉到新線路。

0

我一直在尋找這個項目,我正在努力。我覺得https://www.w3.org/TR/css-text-3/#line-breaking涵蓋這一點,特別是「例5」:

再舉一個例子,韓國有兩種風格斷行的:任何兩個韓國音節之間(字斷:正常)或,如英語,主要是在空格(文字中斷:保持全部)。

事實上,谷歌Chrome(61版)的默認行爲是,它打破的音節(我假設,因爲我不說話或讀韓語)

設置字斷:全部,似乎以覆蓋此行爲並僅將行換行放在空格上。