ホームページ >ウェブフロントエンド >htmlチュートリアル >CSS テキストが ellipses_html/css_WEB-ITnose を超えています
white-space:nowrap; overflow:hidden; -o-text-overflow:ellipsis; text-overflow:ellipsis;
構文:
text-overflow: Clip | ellipsis
パラメータ:
clip: 省略記号(...)を表示せず、単純に切り抜きます
(パラメータclipは一般的ではありません) used!)
ellipsis: オブジェクト内のテキストがオーバーフローしたときに省略記号 (...) を表示します
説明:
テキストのオーバーフローをマークするために省略記号 (...) を使用するかどうかを設定または取得しますオブジェクトの中で。
text-overflow:ellipsis 属性は FF では効果がないことに注意してください。
例:
div { text-overflow : Clip; }
text-overflow は、通常使用するタイトルインターセプト関数を置き換えるために使用でき、以下のような検索エンジンにとってよりフレンドリーです。 : タイトル ファイルには 50 文字の漢字が含まれていますが、リストの幅は 300 ピクセルしかありません。タイトルインターセプト機能を使用した場合、タイトルは完全ではありません。CSS スタイルの text-overflow:ellipsis を使用した場合、出力されるタイトルは完全になりますが、コンテナー サイズの制限により表示されません。
text-overflow属性は、テキストが溢れた場合に省略記号を表示するかどうかの単なる注釈です。他にスタイル属性の定義はありません。オーバーフロー時に省略記号を生成する効果を実現したいと考えています。また、テキストを 1 行で表示するように強制し (white-space:nowrap)、オーバーフローしたコンテンツを非表示にする (overflow:hidden) ことも定義する必要があります。この方法でのみ、オーバーフロー テキストに省略記号を表示する効果を実現できます。