suchen
HeimWeb-FrontendCSS-TutorialSo zentrieren Sie CSS-Text

So zentrieren Sie CSS-Text

May 28, 2019 pm 03:23 PM
css

CSS text-align

text-align-Syntax:

text-align : left | right | center | justify

text-align-Parameterwert und Beschreibung:

left: linksbündig

right : Rechtsbündig

center : Zentriert

*justify : An beiden Enden ausgerichtet (nicht empfohlen, wird normalerweise von den meisten Browsern nicht verwendet)

uns Häufig verwendete Parameterwerte für die Textausrichtung sind links, rechts und zentriert.

Textausrichtungsfunktionsbeschreibung:

Legen Sie die Links-Mitte-Rechts-Ausrichtung des Texts im Objekt fest oder rufen Sie sie ab .

So zentrieren Sie CSS-Text

Fallbeispiel:

Wir richten 3 Boxen ein und stellen die CSS-Höhe und CSS-Breite der Boxen auf den gleichen Wert ein , und legen Sie sie dann separat fest. Der Inhalt der drei Felder wird links, zentriert und rechts ausgerichtet.

Wir haben die Höhe der drei Kästchen auf 50 Pixel und die Breite auf 300 Pixel eingestellt. Zur besseren Übersicht haben wir die drei Kästchen so eingestellt, dass sie einen schwarzen Randstil haben.

1, HTML+CSS-Code

1), CSS-Code

.div1{ width:300px; height:50px; border:1px solid #000; text-align:left} 
.div2{ width:300px; height:50px; border:1px solid #000; text-align:center} 
.div3{ width:300px; height:50px; border:1px solid #000; text-align:right} 
/*  
div1 div2 div3 分别设置 靠左 居中 靠右对齐 
*/

2), HTML-Code

<div class="div1">我被靠左对齐</div> 
<div class="div2">我被居中显示</div> 
<div class="div3">我被靠右对齐</div>

Das obige ist der detaillierte Inhalt vonSo zentrieren Sie CSS-Text. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
'CSS4' Update'CSS4' UpdateApr 11, 2025 pm 12:05 PM

Da ich das CSS4¹ zum ersten Mal eingemischt habe, gab es eine Menge mehr Diskussion darüber. Ich werde meine Lieblingsgedanken von anderen hier zusammenschließen. Es gibt

Die drei Arten von CodeDie drei Arten von CodeApr 11, 2025 pm 12:02 PM

Jedes Mal, wenn ich ein neues Projekt starte, organisiere ich den Code, den ich in drei Typen oder Kategorien betrachte, wenn Sie möchten. Und ich denke, diese Typen können auf angewendet werden

Https ist einfach!Https ist einfach!Apr 11, 2025 am 11:51 AM

Ich war schuldig, die Komplexität von Https öffentlich beklagt zu haben. In der Vergangenheit hat ich SSL-Zertifikate von Drittanbietern gekauft und hatte Probleme

HTML -DatenattributehandbuchHTML -DatenattributehandbuchApr 11, 2025 am 11:50 AM

Alles, was Sie schon immer über Datenattribute in HTML, CSS und JavaScript wissen wollten.

Unveränderlichkeit im JavaScript verstehenUnveränderlichkeit im JavaScript verstehenApr 11, 2025 am 11:47 AM

Wenn Sie in JavaScript noch nicht mit Unveränderlichkeit gearbeitet haben, ist es möglicherweise einfach, sie mit der Zuweisung einer Variablen für einen neuen Wert oder einer Neuzuweisung zu verwechseln.

Benutzerdefinierte Styling -Formulareingaben mit modernen CSS -FunktionenBenutzerdefinierte Styling -Formulareingaben mit modernen CSS -FunktionenApr 11, 2025 am 11:45 AM

Es ist durchaus möglich, benutzerdefinierte Kontrollkästchen, Optionsfelder und Schalter zu erstellen und gleichzeitig semantisch und zugänglich zu bleiben. Wir brauchen nicht einmal eine

FußnoteFußnoteApr 11, 2025 am 11:34 AM

Es gibt spezielle Superset -Nummer -Charaktere, die manchmal perfekt für Fußnoten sind. Hier sind sie:

So erstellen Sie einen animierten Countdown -Timer mit HTML, CSS und JavaScriptSo erstellen Sie einen animierten Countdown -Timer mit HTML, CSS und JavaScriptApr 11, 2025 am 11:29 AM

Haben Sie jemals einen Countdown -Timer für ein Projekt benötigt? Für so etwas ist es möglicherweise natürlich, nach einem Plugin zu greifen, aber es ist tatsächlich viel mehr

See all articles

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

R.E.P.O. Energiekristalle erklärten und was sie tun (gelber Kristall)
3 Wochen vorBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Beste grafische Einstellungen
3 Wochen vorBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. So reparieren Sie Audio, wenn Sie niemanden hören können
3 Wochen vorBy尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: Wie man alles in Myrise freischaltet
3 Wochen vorBy尊渡假赌尊渡假赌尊渡假赌

Heiße Werkzeuge

EditPlus chinesische Crack-Version

EditPlus chinesische Crack-Version

Geringe Größe, Syntaxhervorhebung, unterstützt keine Code-Eingabeaufforderungsfunktion

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SecLists

SecLists

SecLists ist der ultimative Begleiter für Sicherheitstester. Dabei handelt es sich um eine Sammlung verschiedener Arten von Listen, die häufig bei Sicherheitsbewertungen verwendet werden, an einem Ort. SecLists trägt dazu bei, Sicherheitstests effizienter und produktiver zu gestalten, indem es bequem alle Listen bereitstellt, die ein Sicherheitstester benötigen könnte. Zu den Listentypen gehören Benutzernamen, Passwörter, URLs, Fuzzing-Payloads, Muster für vertrauliche Daten, Web-Shells und mehr. Der Tester kann dieses Repository einfach auf einen neuen Testcomputer übertragen und hat dann Zugriff auf alle Arten von Listen, die er benötigt.

MinGW – Minimalistisches GNU für Windows

MinGW – Minimalistisches GNU für Windows

Dieses Projekt wird derzeit auf osdn.net/projects/mingw migriert. Sie können uns dort weiterhin folgen. MinGW: Eine native Windows-Portierung der GNU Compiler Collection (GCC), frei verteilbare Importbibliotheken und Header-Dateien zum Erstellen nativer Windows-Anwendungen, einschließlich Erweiterungen der MSVC-Laufzeit zur Unterstützung der C99-Funktionalität. Die gesamte MinGW-Software kann auf 64-Bit-Windows-Plattformen ausgeführt werden.

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

Leistungsstarke integrierte PHP-Entwicklungsumgebung