Langer HTML-Text wird automatisch abgeschnitten, wenn er die Tag-Breite überschreitet

Wenn wir langen Text anzeigen, müssen wir auf der C#-Seite häufig Zeichen abfangen, aber das ist definitiv keine gute Sache, da unser langer Text häufig durch HTML-Tags dargestellt wird. Wenn Sie ihn nicht richtig laden, werden verstümmelte Zeichen angezeigt (die Hälfte des HTML-Tags wird angezeigt). Eine bessere Möglichkeit besteht darin, diese Funktion über CSS zu implementieren.
Wenn das Span-Tag das Limit überschreitet, wird der Inhalt automatisch umbrochen.

Code kopieren

Der Code lautet wie folgt:

Leerzeichen: Nowrap; Leerzeichen: Norma; Anzeige: Inline-Block;

Wenn die Zeile den automatisch ausgeblendeten Bereich überschreitet, wird sie nicht in einer Zeile angezeigt (muss sich in einem Blockelement befinden).

Code kopieren

Der Code lautet wie folgt:

Überlauf: versteckt; Leerzeichen: Nowrap;

Wenn Sie nach dem Text ein ... hinzufügen möchten, können Sie text-overflow: ellipsis verwenden; die meisten gängigen Browser unterstützen dieses Attribut

Code kopieren

Der Code lautet wie folgt:

.tbconxx {
schweben: links;
Breite: 255px;
Polsterung: 5px 10px;
}
.tbconxx li,tbconxx span {
Polsterung links: 7px;
Textüberlauf: Auslassungspunkte;
Überlauf: versteckt;
Anzeige: Block;
Leerzeichen: Nowrap;
Breite: 240px;
}

Dadurch wird der Text, der das Limit überschreitet, automatisch ausgeblendet.

<<: Zusammenfassung der MySQL InnoDB-Architektur

>>: Zwei Beispiele für die Verwendung von Symbolen in Vue3

Detaillierte Erklärung verschiedener horizontaler und vertikaler Zentrierungsmethoden in HTML (Grundlagen)

Langer HTML-Text wird automatisch abgeschnitten, wenn er die Tag-Breite überschreitet

Detaillierte Erklärung verschiedener horizontaler und vertikaler Zentrierungsmethoden in HTML (Grundlagen)

Detaillierte Erläuterung der Nginx-Installation, SSL-Konfiguration und allgemeinen Befehle unter Centos7.x

Lösung für SQL Server-Datenbankfehler 5123

Analyse der Implementierungsmethode der Koexistenz von Nginx und Apache unter Linux-Servern

Einführung in MySQL-Rollenfunktionen

Tomcat analysiert XML und erstellt Objekte durch Reflektion

Welchen MySQL-Eindeutigen Index oder Normalen Index soll ich wählen?

Ändern Sie die Startzeit von Grub in Ubuntu

CSS löst das Problem der Front-End-Bildverformung perfekt

Einführung in die Installation und Konfiguration von JDK unter CentOS-Systemen

Artikel empfehlen

Detaillierte Erläuterung der benutzerdefinierten Ereignisinhaltsverteilung von Vue

Echarts implementiert das Umschalten verschiedener X-Achsen in einem Diagramm (Beispielcode)

Detaillierte Erläuterung des Prinzips der Vue-Überwachungsdaten

CentOS7-Netzwerkkonfiguration unter virtueller VMware-Maschine (Host für drahtlosen Internetzugang)

JavaScript implementiert eine Eingabefeldkomponente

Problem beim Testen des nicht autorisierten Zugriffs auf Zookeeper

Detaillierte Erklärung der Grundkonzepte von HTML

So verwenden Sie die Vue3-Komponente zum asynchronen Laden von Daten Suspense

Wie erreicht MySQL die Parallelität mehrerer Versionen?

JavaScript imitiert Xiaomi-Karusselleffekt

Zusammenfassung des Unterschieds zwischen der Verwendung von „from“ und „join“ zum Abfragen zweier Tabellen in MySQL

Detaillierte Erklärung des Unterschieds zwischen MySQL-Normalindex und eindeutigem Index

Die Popup-Maske der Frontend-Seite verhindert das Scrollen der Seite

Detaillierte Erklärung zur Verwendung mehrerer Timer in CocosCreator