Change language
Python.Engineering Wiki Javascript Untergeordnetes Element Nach Tag Abrufen

Javascript Untergeordnetes Element Nach Tag Abrufen

__main__ Python module | base64 Python module | code Python module | COM PHP module | dis Python module | Ev PHP module | exp | html Python module | http Python module | imp Python module | io Python module | JavaScript | keyword Python module | numbers Python module | os Python module | PS PHP module | Python functions | re Python module | site Python module | SPL PHP module | StackOverflow | struct Python module | test Python module | time Python module | UI PHP module
Michael Zippo Michael Zippo 04.11.2021

Um einen CSS-Fetttexteffekt zu erstellen , müssen Sie die Eigenschaft font-weight verwenden. Die Eigenschaft font-weight bestimmt die "Stärke" einer Schriftart oder wie fett diese Schriftart erscheint. Sie können Schlüsselwörter oder Zahlenwerte verwenden, um CSS anzuweisen, wie fett ein Textstück sein sollte.

Als Entwickler möchten wir beim Entwerfen einer Website manchmal die Aufmerksamkeit auf etwas lenken . Es gibt mehrere Möglichkeiten, wie wir dies tun können. Am einfachsten ist es, die Zeichenstärke des Textes, den Sie hervorheben möchten, zu erhöhen. Dies bezieht sich darauf, den Text fett erscheinen zu lassen.

In diesem Artikel sprechen wir über die Schriftstärke, wie sie definiert wird, und liefern eine Illustration der verschiedenen möglichen Werte der Eigenschaft.

CSS Fat: A Guide

Die Eigenschaftssätze für die Schriftstärke legen fest, wie fetter Text auf dem Bildschirm erscheinen soll. Sie können Wörter verwenden - Schlüssel oder numerische Werte, um CSS zu sagen, wie fett ein Text zusammen erscheinen soll

Die Syntax der CSS-Eigenschaft font-weight lautet wie folgt:.

Der Wert von weightOfFont ist die Gewichtung der Schriftart, die Sie für das Element verwenden möchten, auf das der Stil angewendet wird.

Die Eigenschaft font-weight akzeptiert einige andere Werte, abhängig von der Schriftstärke, die Sie für ein bestimmtes Element festlegen möchten.

CSS-Skalierung fett

Stellen Sie sich Ihre Schriftfamilie als eine Skalierung von 100 bis 1000 fett vor. Je höher die Zahl, desto fetter das Zeichen

Recherchieren Sie etwas über Ihre bevorzugte Schriftfamilie. Auf diese Weise können Sie sicher sein, dass das Ergebnis auf Ihrer Website so hell oder fett ist, wie Sie es möchten. Einige Schriftfamilien verwenden nicht den vollen Maßstab.

Der folgende Code zeigt, wie hell und wie dunkel eine beliebte Schriftart namens "Arial" bei der Verwendung von Zahlen und Wörtern werden kann - Schlüssel:

und mutiger deutlicher: was bedeuten sie eigentlich?

Die Hauptsache, auf die hier hingewiesen werden muss, ist, dass leichter und mutiger keine wörtliche Übersetzung ist. Fetter bedeutet nicht "fetter als fett"

In der Tat kühner und klarer bedeutet in diesem Zusammenhang, wie fett sie sind oder wie klar sie in Bezug auf ihr übergeordnetes Element sind. Wenn wir also ein gewagteres untergeordnetes Element erstellen, haben sie eine dunklere relative Schriftart als ihre Eltern - dasselbe gilt für die helleren.

Die relativen Zeichengewichte sind wie folgt:

td> < td> 400
Relatives Zeichengewicht < td> tatsächliche Schriftstärke
dünn 100
normal
fett 700
schwer 900

Also könnten wir die Eigenschaft weight font: bold verwenden, um th festzulegen Die Gewichtung eines Textabsatzes auf 800. Wenn ein Kind ein fetteres relatives Gewicht des Elternteils hat, verwenden Sie die obige Tabelle, um zu verstehen, wie dick es ist.

Nehmen wir zum Beispiel an, ich habe ein Kind, das hat ein übergeordnetes Element mit einer Schriftstärke von 400. Wenn ich den Wert für die Schriftstärke auf das fettere untergeordnete Element setze, wird die Schriftstärke des untergeordneten Elements 700.

Das liegt daran, dass das untergeordnete Element im Vergleich eine dunklere Schriftart ist zu -Gewicht als die Eltern. Wenn das übergeordnete Element bereits so dunkel oder so hell wie möglich ist, bewirken diese Eigenschaftswerte nichts.

Beispiel für CSS-Schriftstärke

Nehmen wir an, Sie entwerfen eine Website für The Seattle Stamp Club, eine lokale Briefmarkenfirma. Die Briefmarkenfirma, um die wir Wer sind - wir gebeten haben, erscheint in Fettdruck auf der A About-Website. Dadurch wird die Aufmerksamkeit des Besuchers auf den Titel gelenkt.

Der Briefmarkenclub hat uns gebeten, einen Textblock mit der Geschichte des Clubs auf seiner Website hinzuzufügen. Dieser Textblock sollte in normaler Schriftstärke erscheinen. Einige Sätze, auf die der Club die Aufmerksamkeit des Zuschauers lenken möchte, sollten fett gedruckt werden

Wir könnten den folgenden Code verwenden, um diesen Textblock mit einigen empfohlenen Phrasen zu erstellen:

Klickstil „Bild -Schaltfläche im Code-Editor oben, um die Ausgabe unseres HTML-/CSS-Codes zu sehen.

in unserer HTML-Datei haben wir einen textumschlossenen Absatz von

definiert; . -Tag haben wir auch einige Sätze in eingefügt. Tags, die wir in unserem CSS fördern

Als Nächstes haben wir in unserer CSS-Datei eine Stilregel definiert, die die Gewichtung des Schriftstils jedes < definiert /a> -Tag fetter. Das bedeutet, dass Text, der in ein -Tag eingeschlossen ist, fetter erscheint als das übergeordnete Element.

Wenn wir unseren Code ausführen, erscheint unser Absatz mit normaler Schriftbreite und Sätze, die in -Tags eingeschlossen sind, werden fett dargestellt . In diesem Beispiel sind die Ausdrücke willkommen alle und 250 Mitglieder in -Tags eingeschlossen.

Css-Text in Fettschrift mit variablen Zeichen

Es gibt einige neue Schriftarten, die uns durch die neueste Version von CSS-Schriftarten zur Verfügung gestellt werden. Sie werden variable Zeichen genannt und können eine Zahl zwischen 1 und 1000 als Zeichenbreite annehmen. Die Browserunterstützung wurde erst im Mai 2020 vollständig implementiert, sie sind also ziemlich neu. Wenn Sie weitere Informationen zu variablen Schriftarten wünschen, sehen Sie sich diese rel = "noopener"> Einführung an.

Fazit

In diesem Tutorial haben wir The CSS-Eigenschaft font -weight und wie sie die Fettigkeit unserer Schriftarten beeinflusst.

Wir haben gelernt, dass eine fettere und geringere Gewichtung eine relative Schriftstärke bedeutet, die von der Schriftstärke des übergeordneten Elements abweicht .Im Grunde haben wir uns a angesehen Bereich der Zeichenstärken, um zu sehen, wie der Text aussieht. So werden Sie im Handumdrehen zum Profi der Schriftgewichtung

Um mehr über das Programmieren in CSS zu erfahren, lesen Sie unseren Leitfaden CSS lernen . Sie können unseren Leitfaden weiter lesen wie man Text in HTML fett formatiert, wenn Sie Ihren Text fett formatieren möchten, ohne auf CSS angewiesen zu sein.