So verwenden Sie das Wortumbruch-Attribut
Das Wortumbruch-Attribut wird verwendet, um Zeilenumbruchregeln für Nicht-CJK-Skripte (Chinesisch, Japanisch und Koreanisch) anzugeben, und gibt die Verarbeitungsmethode des automatischen Zeilenumbruchs an. Mithilfe des Wortumbruch-Attributs können Sie dem Browser ermöglichen, an jeder beliebigen Stelle eine Zeile umzubrechen.
CSS3-Wortumbruch-Attribut
Funktion: Wortumbruch-Attribut Gibt an, wie mit dem automatischen Zeilenumbruch umgegangen wird.
Tipp: Durch die Verwendung des Wortumbruch-Attributs können Sie dem Browser erlauben, eine Zeile an jeder Position umzubrechen.
Syntax:
word-break: normal|break-all|keep-all;
normal: Verwenden Sie die standardmäßigen Zeilenumbruchregeln des Browsers.
Alle umbrechen: Zeilenumbrüche innerhalb von Wörtern zulassen.
keep-all: Bei halbbreiten Leerzeichen oder Bindestrichen können nur Zeilenumbrüche vorgenommen werden.
Hinweis: Alle gängigen Browser unterstützen das Wortumbruch-Attribut. Opera unterstützt das Wortumbruch-Attribut jedoch nicht.
Verwendungsbeispiel des CSS3-Wortumbruchattributs
<!DOCTYPE html>
<html>
<head>
<style>
p.test1
{
width:11em;
border:1px solid #000000;
word-break:keep-all;
}
p.test2
{
width:11em;
border:1px solid #000000;
word-break:break-all;
}
p.test3
{
width:11em;
border:1px solid #000000;
word-break:keep-all;
}
p.test4
{
width:11em;
border:1px solid #000000;
word-break:break-all;
}
</style>
</head>
<body>
<p class="test1">This is a veryveryveryveryveryveryveryveryveryvery long paragraph.</p>
<p class="test2">This is a veryveryveryveryveryveryveryveryveryvery long paragraph.</p>
<p class="test3">This paragraph contains some text: The lines will break at any character.</p>
<p class="test4">This paragraph contains some text: The lines will break at any character.</p>
</body>
</html>Rendering:
Referenz für diesen Artikel:https://www.html.cn/book/css/properties/text/word-break.htm
Das obige ist der detaillierte Inhalt vonSo verwenden Sie das Wortumbruch-Attribut. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
Heiße KI -Werkzeuge
Undresser.AI Undress
KI-gestützte App zum Erstellen realistischer Aktfotos
AI Clothes Remover
Online-KI-Tool zum Entfernen von Kleidung aus Fotos.
Undress AI Tool
Ausziehbilder kostenlos
Clothoff.io
KI-Kleiderentferner
Video Face Swap
Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!
Heißer Artikel
Heiße Werkzeuge
Notepad++7.3.1
Einfach zu bedienender und kostenloser Code-Editor
SublimeText3 chinesische Version
Chinesische Version, sehr einfach zu bedienen
Senden Sie Studio 13.0.1
Leistungsstarke integrierte PHP-Entwicklungsumgebung
Dreamweaver CS6
Visuelle Webentwicklungstools
SublimeText3 Mac-Version
Codebearbeitungssoftware auf Gottesniveau (SublimeText3)
Heiße Themen
1393
52
1205
24
Wie erzielt man mit reinem CSS3 einen Welleneffekt? (Codebeispiel)
Jun 28, 2022 pm 01:39 PM
Wie erzielt man mit reinem CSS3 einen Welleneffekt? In diesem Artikel erfahren Sie, wie Sie mit SVG- und CSS-Animationen Welleneffekte erstellen.
So deaktivieren Sie den automatischen Zeilenumbruch in Word
Mar 19, 2024 pm 10:16 PM
Beim Bearbeiten von Inhalten in einem Word-Dokument werden Zeilen möglicherweise automatisch umgebrochen. Wenn zu diesem Zeitpunkt keine Anpassung vorgenommen wird, hat dies große Auswirkungen auf unsere Bearbeitung und bereitet den Leuten große Kopfschmerzen. Tatsächlich handelt es sich um ein Problem mit dem Lineal. Im Folgenden werde ich die Lösung zum Aufheben des automatischen Zeilenumbruchs in Word vorstellen. Nachdem Sie ein Word-Dokument geöffnet und Text eingegeben haben, springt der Text beim Kopieren und Einfügen möglicherweise in eine neue Zeile. In diesem Fall müssen Sie die Einstellungen anpassen, um dieses Problem zu lösen. 2. Um dieses Problem zu lösen, müssen wir zunächst die Ursache dieses Problems kennen. Zu diesem Zeitpunkt klicken wir in der Symbolleiste auf „Ansicht“. 3. Klicken Sie dann unten auf die Option „Lineal“. 4. Zu diesem Zeitpunkt werden wir feststellen, dass über dem Dokument ein Lineal mit mehreren konischen Markierungen darauf erscheint.
Verwenden Sie CSS geschickt, um verschiedene seltsam geformte Schaltflächen zu realisieren (mit Code).
Jul 19, 2022 am 11:28 AM
Dieser Artikel zeigt Ihnen, wie Sie mithilfe von CSS auf einfache Weise verschiedene seltsam geformte Schaltflächen realisieren können, die häufig vorkommen. Ich hoffe, dass er Ihnen hilfreich sein wird!
Wie man WPS-Tabellen automatisch umschließt und erzwingt
Mar 20, 2024 pm 07:46 PM
Für einige unerfahrene Freunde sind der automatische Zeilenumbruch und der erzwungene Zeilenumbruch in Excel noch nicht klar. Heute informiert Sie der Editor über den automatischen Zeilenumbruch und den manuellen Zeilenumbruch in Excel! Funktion zum automatischen Zeilenumbruch in Excel: Wählen Sie zunächst den Zellbereich aus, auf den Sie den Zeilenumbruch anwenden möchten, und klicken Sie dann auf die Schaltfläche „Start“ – „Ausrichtung“ – „Automatisch umbrechen“. Die Länge des Textumbruchs in einer Zelle hängt von der Spaltenbreite der Zelle ab. Wenn Sie die Spaltenbreite ändern, wird der Text automatisch umbrochen. Excel-Tastenkombination für erzwungenen Zeilenumbruch Wenn Sie die Zeile entsprechend der gewünschten Position umbrechen müssen, können Sie auf die Zelle doppelklicken, den Cursor hinter dem Zeilenumbruchinhalt positionieren und dann die Tastenkombination „ALT+Eingabe“ verwenden. Der Unterschied zwischen automatischem Zeilenumbruch und erzwungenem Zeilenumbruch wird hier erklärt
So verstecken Sie Elemente in CSS, ohne Platz zu beanspruchen
Jun 01, 2022 pm 07:15 PM
Zwei Methoden: 1. Fügen Sie mit dem Anzeigeattribut einfach den Stil „display:none;“ zum Element hinzu. 2. Verwenden Sie die Attribute „position“ und „top“, um die absolute Positionierung des Elements festzulegen, um das Element auszublenden. Fügen Sie dem Element einfach den Stil „position:absolute;top:-9999px;“ hinzu.
So implementieren Sie Spitzenränder in CSS3
Sep 16, 2022 pm 07:11 PM
In CSS können Sie das Attribut „border-image“ verwenden, um einen Spitzenrand zu erzielen. Das Attribut „border-image“ kann Bilder zum Erstellen von Rändern verwenden, d. h. zum Hinzufügen eines Hintergrundbilds zum Rand. Sie müssen lediglich das Hintergrundbild als Spitzenstil angeben Bildrandbreite nach innen. Ob der Anfang wiederholt wird;".
So vergrößern Sie das Bild durch Klicken mit der Maus in CSS3
Apr 25, 2022 pm 04:52 PM
Implementierungsmethode: 1. Verwenden Sie den Selektor „:active“, um den Status des Mausklicks auf das Bild auszuwählen. 2. Verwenden Sie das Transformationsattribut und die Funktion „scale()“, um den Bildvergrößerungseffekt zu erzielen. Die Syntax „img:active {transform : Skala(x-Achsen-Vergrößerung, y-Achsen-Vergrößerung);}".
Es zeigt sich, dass Textkarussell und Bildkarussell auch mit reinem CSS realisierbar sind!
Jun 10, 2022 pm 01:00 PM
Wie erstelle ich ein Textkarussell und ein Bildkarussell? Das erste, woran jeder denkt, ist die Verwendung von js. Tatsächlich können Textkarussell und Bildkarussell auch einen Blick auf die Implementierungsmethode werfen.
