方法 1:
注: 利点は、ハイパーリンクや画像などを含む任意の HTML 要素をコンテンツにできることです。IE6 では、末尾に省略記号が自動的に表示されます。欠点は、幅の値を指定する必要があり、幅をパーセンテージで指定することはできないことです。そうでないと、IE では文字長の合計に対するパーセンテージとしてみなされてしまいます。
方法 2:
注: 利点は、幅をパーセンテージで設定できることです。ただし、コンテンツはプレーン テキストのみであり、ハイパーリンクやその他のコンテンツを含めることができないという欠点があります。
CSS は文字列を切り詰めます CSS は自動テキスト切り詰めを実装します。コードは次のとおりです。
幅:200px;
高さ:14px;
オーバーフロー:非表示;
空白:nowrap;
テキストオーバーフロー:省略記号;
text-overflow: ellipsis;/* IE/Safari */
-ms-text-overflow: 省略記号;
-o-text-overflow: ellipsis;/* Opera */
-moz-binding: url("ellipsis.xml#ellipsis");/*FireFox*/
}
キーは text-overflow で、その構文は次のとおりです。
この属性は IE 専用であることに注意してください。ただし、利用できるのは IE だけではありません。このタグは公にサポートされておらず、Guaioh によって採用されていませんが、多くのブラウザのプライベート属性に含まれています。 text-overflow だけでは機能しません。white-space:nowrap;overflow:hidden; と組み合わせる必要があります。前の文の機能は、テキストの終わりまたは br オブジェクトに到達するまで、すべてのテキストを強制的に同じ行に表示することです。
テキスト オーバーフローを使用するのに最適な場所は、記事のテキストではなく、1 行で表示されるタイトルや要約のリストであることは、難しくありません。
構文:
値:
説明:
オブジェクト内の空白文字の処理方法を設定または取得します。
改行、スペース、TAB などのスペース文字は、HTML ドキュメントではデフォルトで無視されます。このプロパティが Normal または nowrap に設定されている場合、非改行スペース名前付きエンティティを使用して空白を追加し、 br 要素を使用して改行を追加できます。このプロパティは、IE で表示されるコンテンツと同じように、ドキュメント オブジェクト モデル (DOM) を使用して操作するコンテンツにも影響します。
このプロパティはブロック オブジェクトに対して機能します。
このプロパティは、currentStyle オブジェクトに対して読み取り専用です。他のオブジェクトについては、読み取りと書き込みが可能です。
対応するスクリプト属性は、whiteSpace です。