22

次の CSS が機能しないのはなぜですか?

a {
    width: 60px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
4

3 に答える 3

37

これは、アンカーが標準のinline要素であるためです。追加display:inline-blockすると、上記のコードが機能します。

于 2012-07-14T20:39:36.217 に答える
9

ボックスモデル用display:blockです、仕事をします

a {
    width: 60px;
    display:block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}​

ただし、アンカー (インライン要素) をボックス モデル要素 (display:block) のように動作させると、他の問題が発生する可能性があります。

参考: テキストオーバーフロー

アップデート:

display:inline-block

デモ。

于 2012-07-14T20:40:21.890 に答える
1

display: blockcssに追加します。

于 2012-07-14T20:42:01.437 に答える