suchen

Heim  >  Artikel  >  Web-Frontend  >  Wie stelle ich die Groß- und Kleinschreibung von Buchstaben in CSS ein? Die Texttransformationseigenschaft legt die Groß- und Kleinschreibung von Buchstaben fest (Einführung)

Wie stelle ich die Groß- und Kleinschreibung von Buchstaben in CSS ein? Die Texttransformationseigenschaft legt die Groß- und Kleinschreibung von Buchstaben fest (Einführung)

青灯夜游
青灯夜游Original
2018-10-12 10:29:5210240Durchsuche

Manchmal müssen wir den ersten Buchstaben eines englischen Wortes oder Pinyin großschreiben oder alle chinesischen und englischen Wörter im gesamten Text in Groß- oder Kleinbuchstaben schreiben. Was ist also der Effekt? In diesem Artikel erfahren Sie, wie Sie die Groß-/Kleinschreibung von Buchstaben in CSS festlegen, damit Sie verstehen, wie das Texttransformationsattribut die Groß-/Kleinschreibung von Buchstaben festlegt. Es hat einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen. Ich hoffe, es wird Ihnen hilfreich sein.

Lassen Sie uns zunächst etwas über das Texttransformationsattribut lernen!

Das Texttransformationsattribut kann die Groß-/Kleinschreibung von Text steuern und ändert die Groß-/Kleinschreibung von Buchstaben im Element unabhängig von der Groß-/Kleinschreibung des Textes im Quelldokument. Wenn der Attributwert „capitalize“ ist, werden einige Buchstaben großgeschrieben, aber es ist nicht klar definiert, wie ermittelt wird, welche Buchstaben großgeschrieben werden. Es liegt am Benutzerprogramm, die einzelnen „Wörter“ zu erkennen.

Sehen wir uns an, wie der Attributwert des Texttransformationsattributs die Groß- und Kleinschreibung von Zeichen steuern kann:

Großschreibung : Text festlegen Jedes Wort in beginnt mit einem Großbuchstaben, d. h. der erste Buchstabe jedes Wortes wird großgeschrieben.

Großbuchstaben: Definiert nur Großbuchstaben und legt fest, dass jeder Buchstabe im Text in Großbuchstaben angezeigt wird.

Kleinbuchstaben Definieren Sie keine Großbuchstaben, sondern nur Kleinbuchstaben und legen Sie fest, dass jeder Buchstabe im Text in Kleinbuchstaben angezeigt wird.

Wir verwenden ein einfaches Codebeispiel, um mehr darüber zu erfahren, wie die oben genannten Attributwerte implementiert werden. 

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>Text-transform属性设置大小写</title>
		<style type="text/css">
			h1 {text-transform: uppercase}
			
			p.uppercase {text-transform: uppercase}
			
			p.lowercase {text-transform: lowercase}
			
			p.capitalize {text-transform: capitalize}
		</style>
	</head>
	<body>
		<h1>Text-transform属性设置大小写</h1>
		<p class="uppercase">Text-transform属性设置全大写</p>
		<p class="lowercase">Text-transform属性设置全小写</p>
		<p class="capitalize">Text-transform属性设置首字母大写</p>
	</body>
</html>

Rendering:

Wie stelle ich die Groß- und Kleinschreibung von Buchstaben in CSS ein? Die Texttransformationseigenschaft legt die Groß- und Kleinschreibung von Buchstaben fest (Einführung)

Hinweis: Alle Browser unterstützen das Texttransformationsattribut.

Zusammenfassung: Das Obige ist der gesamte Inhalt dieses Artikels, ich hoffe, dass er für das Studium aller hilfreich sein wird. Weitere verwandte Tutorials finden Sie unter CSS-Video-Tutorial !

Verwandte Empfehlungen:

PHP-Video-Tutorial zur öffentlichen Wohlfahrtsschulung

CSS-Online-Handbuch

Div/CSS-Grafik-Tutorial

Das obige ist der detaillierte Inhalt vonWie stelle ich die Groß- und Kleinschreibung von Buchstaben in CSS ein? Die Texttransformationseigenschaft legt die Groß- und Kleinschreibung von Buchstaben fest (Einführung). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

php css transform
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
Vorheriger Artikel：CSS3 implementiert den Schriftleuchteffekt (Codebeispiel)Nächster Artikel：CSS3 implementiert den Schriftleuchteffekt (Codebeispiel)

In Verbindung stehende Artikel

Mehr sehen