ホームページ >ウェブフロントエンド >htmlチュートリアル >CSS - テキストが指定された幅を超えているため非表示になり、ellipses_html/css_WEB-ITnose として表示されます。

CSS - テキストが指定された幅を超えているため非表示になり、ellipses_html/css_WEB-ITnose として表示されます。

WBOY
WBOYオリジナル
2016-06-24 11:54:33856ブラウズ

一般的なテキストの切り捨て (インラインおよびブロックに適用可能):

.text-overflow {

Display:block;/*インライン オブジェクトを追加する必要があります*/

width:25em;

word - Break:keep-all;/* 改行なし*/

white-space:nowrap;/* 改行なし*/

overflow:hidden;/* コンテンツが幅を超える場合、余分なコンテンツを非表示*/

text-overflow:ellipsis;/* オブジェクト内のテキストが overflow:hidden; と一緒に使用される必要がある場合は、省略記号 (...) を表示します。 */

}

テーブルテキストオーバーフローの定義:

範囲外のテーブルには省略記号を表示します

table{

width:25em;

table-layout:fixed;/* テーブルのみが定義されていますレイアウト アルゴリズムは固定されており、以下の td の定義は機能します。 */

}

td{

width:100%;

word-break:keep-all;/* 改行なし*/

White-space:nowrap;/* 改行なし*/

overflow: hidden;/* コンテンツが幅を超える場合は余分なコンテンツを非表示にします*/

text-overflow:ellipsis;/* オブジェクト内のテキストを一緒に使用する必要がある場合は省略記号 (...) を表示します。オーバーフロー:非表示; あり。 */

}

など:

--------------------------------- -------------------------------------------------- - ------------

省略記号をホバーしてコンテンツを表示したい場合は、タイトルにそれを書いてください~

コード:

れーれー

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。