ホームページ ウェブフロントエンド CSSチュートリアル CSS は指定されたテキストの幅を超えているため、代わりに省略記号が使用され、テキストは折り返されません。

CSS は指定されたテキストの幅を超えているため、代わりに省略記号が使用され、テキストは折り返されません。

Mar 13, 2017 pm 04:41 PM
css

この記事では、テキストが指定された幅を超え、テキストを折り返さない場合に、CSS を置き換えるために楕円を使用することに関する関連情報を主に紹介します 。編集者は、これが非常に実用的であると考え、参考のために Script House プラットフォームで共有します

一般的なテキストの切り捨て (インラインおよびブロックの場合):

.text-overflow {   
    display:block;/*内联对象需加 */
    width:31em;/* 何问起 hovertree.com */
    word-break:keep-all;/* 不换行 */
    whitewhite-space:nowrap;/* 不换行 */
    overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */
    text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(...) ;需与overflow:hidden;一起使用。*/
}
ログイン後にコピー

tableテキストのオーバーフローの場合 定義:

範囲外のテーブルの場合は省略記号を表示りー

必要 注意すべき点は、この CSS スタイルはテキストの 1 行でのみ機能することです。複数行で使用する場合は、最初の行のみが機能します。

この書き方で「…」が入るのはIEだけです

他のブラウザでは指定した幅を超えると文字が非表示になります。 上記は、CSS が指定されたテキストの幅を超え、テキストが折り返されない場合の省略記号の使用についての紹介です。また、PHP 中国語 Web サイトをご利用いただき、誠にありがとうございます。 !

以上がCSS は指定されたテキストの幅を超えているため、代わりに省略記号が使用され、テキストは折り返されません。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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

ホットな記事タグ

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

Vue におけるプレースホルダーの意味 Vue におけるプレースホルダーの意味 May 07, 2024 am 09:57 AM

Vue におけるプレースホルダーの意味

vueでスペースを書く方法 vueでスペースを書く方法 Apr 30, 2024 am 05:42 AM

vueでスペースを書く方法

vueでdomを取得する方法 vueでdomを取得する方法 Apr 30, 2024 am 05:36 AM

vueでdomを取得する方法

jsでのスパンの意味は何ですか jsでのスパンの意味は何ですか May 06, 2024 am 11:42 AM

jsでのスパンの意味は何ですか

jsでレムは何を意味しますか jsでレムは何を意味しますか May 06, 2024 am 11:30 AM

jsでレムは何を意味しますか

vueに画像を導入する方法 vueに画像を導入する方法 May 02, 2024 pm 10:48 PM

vueに画像を導入する方法

スパンタグの機能とは何ですか スパンタグの機能とは何ですか Apr 30, 2024 pm 01:54 PM

スパンタグの機能とは何ですか

プロンプトをjsでラップする方法 プロンプトをjsでラップする方法 May 01, 2024 am 06:24 AM

プロンプトをjsでラップする方法

See all articles