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つの例

推薦する

フロントエンドはJavaScriptを通じてCADグラフィックスの詳細を作成および変更します。

目次1. 現状2. JSでCADグラフィックを作成および変更する2.1 サポートされているCADエン...

Linux での MySQL 5.6 バイナリのインストール プロセス

1.1 バイナリインストールパッケージをダウンロードするhttps://dev.mysql.com/...

ドラミング効果を実現するJavascript

この記事では、ドラミング効果を実現するためのJavascriptの具体的なコードを参考までに紹介しま...

Mac に Windows サービスを備えた仮想マシンをインストールする方法

1. 仮想マシンをダウンロードする公式ダウンロードウェブサイト: https://www.vmwar...

フロントエンドセキュリティの詳細な説明: JavaScript の http ハイジャック対策と XSS

目次HTTP ハイジャック、DNS ハイジャック、XSS HTTPハイジャックDNSハイジャックXS...

Dockerはbusyboxを使用してベースイメージを作成します

Docker イメージの最初の行は FROM alpine などのイメージで始まりますが、最初のベー...

jsvc を使用して tomcat を起動する方法 (通常のユーザーとして実行)

jsvc の紹介実稼働環境では、Tomcat はデーモン モードで実行する必要があります。Tomc...

Dockerを使用してコンテナリソースを制限する方法

覗き見の問題サーバーでは、IIS サービスが複数のサイトを展開していると仮定すると、サイトの 1 つ...

Mysql クラシック高レベル/コマンドライン操作 (クイック) (推奨)

サーバーとデータベースの構築方法を学ぶ必要があるため、最近は SQL 言語を独学で学び始めました。デ...

wavesurfer.js によるオーディオ波形描画の実装

1. レンダリングを見る進むを選択: 後方を選択: コードは次のとおりです(例): <テンプレ...

MySQL の null と not null、null と空の値の違いの詳細な説明 ''''

MySQL を長い間使用してきた多くの人は、これら 2 つのフィールド属性の概念をまだよく理解して...

よく使用される入力テキストボックスの内容は自動的に垂直方向に中央揃えされ、クリックするとデフォルトのプロンプトテキストは空になります。

3つの機能: 1. コンテンツの垂直方向の自動中央揃え2. デフォルトのプロンプトテキストは灰色で表...

位置のいくつかの巧妙な応用の詳細な説明:sticky スティッキーポジショニング

背景: position:sticky はスティッキー配置とも呼ばれます。スティッキー配置の要素は、...

Hタグの定義と注意事項について簡単に説明します

結果から判断すると、タイトルを定義するための固定パターンはなく、すべてむしろランダムな感じがします。...

Linuxカーネルスケジューラソースコード初期化の分析

目次1. はじめに2. スケジューラの基本概念2.1. 実行キュー (rq) 2.2 スケジューリン...