0

私のCSS:

   .testBox {
        width: 100px;
        height: 200px;
        border: 1px solid;
        word-wrap: break-word;
        word-break: normal;
    }

私のHTML:

<div class="testBox">
    <p>中新网北京1月4日电(记者 俞岚 周锐)中国对3.53亿元<span>人&lt;/span><span>民&lt;/span><span>币&lt;/span><span>。&lt;/span>这也是迄今为止中国开出的金额最高的一张价格违法罚单&lt;/p>
</div>
<div class="testBox">
    <p>中新网北京1月4日电(记者 俞岚 周锐)中国对3.53亿元人民币。这也是迄今为止中国开出的金额最高的一张价格违法罚单&lt;/p>
</div>
<div class="testBox">
    <p>123456789<span>a</span><span>b</span><span>c</span><span>d</span>efghigkilmnopqrstuvwxz</p>
</div>
<div class="testBox">
    <p>123456789abcdefghigkilmnopqrstuvwxz</p>
</div>

「亿」に気をつけてください!その後、IEではなく、Chromeでは区切りがあります。

キャラクターを包む「スパン」を作成しました...なぜですか??? 同じ効果を得るための書き方

4

2 に答える 2

1

CSSドキュメント:

プロパティは、非 CJK スクリプトのword-break改行規則を指定します。

ヒント: CJK スクリプトは、中国語、日本語、および韓国語 (「CJK」) のスクリプトです。

だから、CJK Scriptsではうまくいかないと思います...

于 2013-01-23T10:20:40.900 に答える
0

使用する

word-break: break-all;

CSS3 Textドラフトによると、このような設定では任意の 2 文字の間に改行を入れることができます。「このオプションは主に、テキストが主に CJK 文字を使用し、CJK 以外の抜粋がほとんどないコンテキストで使用され、テキストが各行により適切に分散されることが望まれます。」</p>

この値normalは、多かれ少なかれブラウザに依存する「通常のルールに従って単語が分割される」ことを意味します。

于 2013-01-23T11:12:07.877 に答える