CSSで出力ワード数を制御する方法

出力単語数を制御する Css メソッド: 最初に HTML サンプル ファイルを作成し、次にテキストを定義し、最後に CSS スタイル「overflow:hidden;」および「text-overflow:ellipsis;」を使用してテキスト オーバーフロー表示を実装します。 " 省略記号効果で十分です。

このチュートリアルの動作環境: Windows7 システム、HTML5&&CSS3 バージョン、Dell G3 コンピューター。

テキスト コンテンツの場合、単語数を制限するには 2 つの一般的な方法があります。最も一般的なのは、バックグラウンド プログラムの出力時に出力される単語数を制限することです。もう 1 つは、フロント エンドで CSS を使用して、テキストのオーバーフローを制御します。出力ワード数を制限するプログラムを使用することをお勧めします。コンテンツのパディングや要素のオーバーフローの場合、これは CSS の非標準化と互換性のカテゴリに分類されます。

テキストのオーバーフローと省略記号の CSS 記述方法の一覧です。

{
overflow:hidden;
text-overflow:ellipsis;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;(这里是行数 你可以控制你想在第几行末尾多余的显示省略号，之前的文本正常显示)
}

拡張情報

CSS (Cascading Style Sheet)

Cascading Style Sheet (英語の正式名: Cascading Style Sheets) は、HTML (Standard Generalized Markup Language のアプリケーション) や XML (Standard Generalized Markup Language のサブセット) などのドキュメント スタイルを表現するために使用されるコンピュータ言語です。 CSS は Web ページを静的に変更できるだけでなく、さまざまなスクリプト言語と連携して、Web ページのさまざまな要素を動的にフォーマットすることもできます。

CSS は、Web ページ内の要素の位置のレイアウトをピクセルレベルで正確に制御でき、ほぼすべてのフォント サイズ スタイルをサポートし、Web ページのオブジェクトとモデル スタイルを編集する機能を備えています。

推奨: 「css ビデオ チュートリアル 」

以上がCSSで出力ワード数を制御する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。