Heim > Web-Frontend > CSS-Tutorial > Hauptteil

Detaillierte Einführung in den Hintergrund und Text im CSS-Stil

高洛峰
Freigeben: 2017-03-09 10:38:12
Original
1440 Leute haben es durchsucht

1. Hintergrund

1. Verwenden Sie das Attribut „Hintergrundfarbe“ für die Hintergrundfarbe, zum Beispiel: body{background-color:red}.

2. Verwenden Sie das Attribut „Hintergrundbild“, um ein Bild als Hintergrund zu verwenden, z. B. „body{background-image:ul1(23.jpg)“

3 Um den Hintergrund eines Bilds wiederholt zu kacheln, bedeutet „Wiederholung-x“ oder „Wiederholung-y“ horizontales bzw. vertikales Kacheln.

keine Wiederholung bedeutet, dass Kacheln aus jeder Richtung zulässig sind

Zum Beispiel: Körper
{background-image:url(23 .jpg)
background-repeat:repeat-x:) }

4. Verwenden Sie das Attribut „background-position“, um den Hintergrund zu positionieren, [position: oben, unten , links, rechts, Mitte, Sie können auch

Prozent (50 % 50 %), Längenwert (50px 50px)]

Zum Beispiel: Körper
{background-image:url (23.jpg)
background-position:center}

5. Verwenden Sie „background-attachment“, um die Bildzuordnungsattribute festzulegen Der Hintergrund des Bildes unten scrollt nicht mit dem Scrollen des Textes

body{background-image:url(23.jpg);

background-repeat:no-repeat;
background-attachment :fixed;}

2. Verwenden Sie das text-indent-Attribut, um Text einzurücken Der Einzugswert kann eine negative Zahl sein Zum Beispiel: p{text-indent:-5em}, aber das Festlegen einer negativen Zahl kann leicht über den linken Rand des Browserfensters hinausgehen , daher sollte besonderes Augenmerk darauf gelegt werden;

Die Einheit des Einzugswerts kann Prozent sein, die Längeneinheit px und die Maßeinheit em;

Das Attribut text-indent kann vererbt werden, z Beispiel:

p#outer {width:500px;}

p#inter {text-indent:10%}

p{width:200px;}

< p id="outer"> ;

etwas Text.einiger Text.einiger Text.

das ist ein Praggramm


< /p>
< ;/p>

2. Verwenden Sie Textausrichtungsattribute (links, rechts, zentriert, rechts) für die horizontale Ausrichtung

3 ), der Standardwert normal ist derselbe wie der Einstellungswert 0,
Wortabstand akzeptiert positive Längenwerte und negative Längenwerte

4, Buchstabenabstand Ändern Sie den Abstand zwischen Zeichen und Buchstaben. Der Standardwert normal ist derselbe wie der Wert 0

. Akzeptieren Sie positive und negative Längenwerte

5. text -transform behandelt die Groß- und Kleinschreibung von Text (keine, Großbuchstaben in Großbuchstaben, Kleinbuchstaben in Kleinbuchstaben, Großschreibung des ersten Buchstabens in Großbuchstaben

6. text-decoration behandelt die Textdekoration (keine, unterstrichen, überstrichen, durchgestrichen), blinkt blinkend

7. Leerzeichen verarbeiten Leerzeichen

Wert Vorzeile, Leerzeichen: Zusammenführung, Zeilenumbruch: reserviert, automatischer Zeilenumbruch: zulässig; normal, Leerzeichen: Merge, Newline-Zeichen: Ignorieren, automatischer Zeilenumbruch: erlaubt;

Wert nowrap, Leerzeichen: Merge, Newline-Zeichen: reserviert, automatisches Newline-Zeichen: nicht erlaubt

Wert Pre-Wrap, Leerzeichen : reserviert, Zeilenumbruch: reserviert, automatischer Zeilenumbruch: zulassen

8. Das Richtungsattribut beeinflusst die Schreibrichtung von Text in Elementen auf Blockebene, die Richtung des Layouts in Listen und die Richtung des Inhalts, der ihn horizontal ausfüllt Textfeld und die Richtung der letzten Zeile in ausgerichteten Elementen (es gibt zwei Werte, ltr und rtk, wobei ltr der Standardwert ist, der die Richtung von links nach rechts darstellt)


9 -height legt die Zeilenhöhe fest

Eine kurze Diskussion des oben Gesagten. Der Hintergrund und der Text des CSS-Stils sind alle vom Herausgeber geteilten Inhalte. Ich hoffe, dass er Ihnen eine Referenz geben kann, und ich hoffe auch, dass Sie ihn unterstützen die chinesische PHP-Website.

Das obige ist der detaillierte Inhalt vonDetaillierte Einführung in den Hintergrund und Text im CSS-Stil. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
css
Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage