HTML の長いテキストは、タグの幅を超えると自動的に切り捨てられます。

HTML の長いテキストは、タグの幅を超えると自動的に切り捨てられます。
長いテキストを表示する場合、C# 側で文字をインターセプトする必要があることがよくありますが、長いテキストは HTML タグで表されることが多いため、これは決して良いことではありません。適切に読み込まれないと、文字化けした文字が表示されます (HTML タグの半分が表示されます)。より良い方法は、この機能を CSS で実装することです。
span タグが制限を超えると、コンテンツは自動的に折り返されます。

コードをコピー
コードは次のとおりです。

white-space:nowrap;white-space:norma;display:inline-block;

行が自動的に非表示になる領域を超えると、行には表示されません(ブロック要素内にある必要があります)

コードをコピー
コードは次のとおりです。

オーバーフロー:非表示;空白:折り返しなし;

テキストの後に...を追加したい場合は、text-overflow: ellipsisを使用できます。ほとんどの主流ブラウザはこの属性をサポートしています。

コードをコピー
コードは次のとおりです。

.tbconxx {
フロート: 左;
幅: 255px;
パディング: 5px 10px;
}
.tbconxx li、tbconxx span {
左パディング: 7px;
テキストオーバーフロー: 省略記号;
オーバーフロー: 非表示;
表示: ブロック;
空白: ラップなし;
幅: 240ピクセル;
}

これにより、制限を超えたテキストが自動的に非表示になります。

<<:  MySQL InnoDB アーキテクチャの概要

>>:  Vue3でアイコンを使用する2つの例

推薦する

h5入力ボックスプロンプト+通常のテキストボックスプロンプトを実装する方法

XML/HTML コードコンテンツをクリップボードにコピー<入力 id = "ユーザ...

ウェブデザインの達人がよく使うレスポンシブフレームワークを共有する(要約)

この記事では、Web デザインの達人がよく使用するレスポンシブ フレームワーク (概要) を紹介し、...

Tomcat サーバー入門の超詳細なチュートリアル

目次1. Tomcat の概念–1、サーバー–2、ウェブサーバー–3、Tomcatサーバー次にTom...

CSS3 は、跳ねるボール効果を実現する Web アニメーションを作成します。

基本的な準備この実装には、クラス名が ball である単純な div が必要です。 HTMLコード:...

面接の質問: 3 行 3 列のレイアウト、表は結合され、ネストされた表は許可されません

面接の質問で、3 行 3 列のレイアウトが求められます。1 行目の 2 番目の列と 2 行目の 2 ...

64 ビット CentOs7 ソース コードのインストール mysql-5.6.35 プロセス共有

インストールプロセス中に問題が発生しないように、まず依存パッケージをインストールします。 [root...

mysql トリガーの作成と使用例

目次トリガーとは何かトリガーを作成するMySQL 作成構文のキーワードの説明: 1. MySQL ト...

ブルートフォース攻撃を防ぐためのシェルスクリプト設定

シェルスクリプトはアクセス制御を設定し、複数回のログイン失敗後にIPをブロックしてSSHのブルートフ...

Flask アプリケーションの Docker デプロイ実装手順

1. 目的Flask アプリケーションをローカルで作成し、Docker でパッケージ化し、独自のサー...

VueプロジェクトでReactを書く方法の詳細

jsx/tsxファイルを直接作成できます今回のプロジェクト構成は以下のとおりです。 vueファイルで...

Linux nlコマンドの使い方

1. コマンドの紹介nl (行数) は指定されたファイルに行番号を追加し、標準出力に書き込みます。フ...

Webデザインチュートリアル(1):手順と全体レイアウト

<br />注:ウェブサイトの種類を示すものを除くすべてのテキストは、企業サイト用です。...

なぜCSSをヘッドタグに配置する必要があるのか

考えてみてください。なぜcss 、 javascriptのようにbodyタグの末尾ではなく、 hea...

CentOS MySQLデータベースのスケジュールバックアップを実装する方法

次のスクリプトは、MySQLデータベース全体のスケジュールされたバックアップに使用されます。 mys...

CMD で MySQL データベースを操作するときに中国語の文字化けが発生する問題の解決方法

Baiduで検索しました。 。 chcp コマンドを使用して、cmd の文字エンコーディングを 65...