Heim > Artikel > Web-Frontend > Detaillierte Änderung verschiedener Schriftartformate für die Erstellung von HTML-Webseiten_HTML/Xhtml_Webseiten
Detaillierte Änderung verschiedener Schriftartformate für die Erstellung von HTML-Webseiten_HTML/Xhtml_Webseiten
- WBOYOriginal
- 2016-05-16 16:43:343801Durchsuche
Dieser Abschnitt beginnt mit der detaillierten Änderung des Textes, damit die Leser die Änderungen in verschiedenen HTML-Schriftformaten verstehen und professionellere Webseiten erstellen können.
4.2 Diverse Textmodifikationen
Im vorherigen Abschnitt haben wir verschiedene Einstellungen für große Absätze kennengelernt und es erscheint attraktiver, den Text selbst zu ändern. Dieser Abschnitt beginnt mit der detaillierten Änderung des Textes, damit die Leser die Änderungen in verschiedenen HTML-Schriftformaten verstehen und professionellere Webseiten erstellen können.
4.2.1 Grundlegende Tags für die Textstileinstellung –
Das grundlegende Tag zum Festlegen von Schriftstilen ist , und der darin enthaltene Text ist der Stilbereich. Beim Schreiben von HTML-Code für Anfänger wird leicht mehrfach verschachtelt, z. B. als -Text . Eine andere Situation ist eine falsch ausgerichtete Beschriftungsverschachtelung, z. B.
Text
. Um das Schreiben von Code zu standardisieren und unnötige Fehler zu vermeiden, müssen Leser beim Lernen vorsichtig sein.4.2.2 Textfarbe festlegen
Farbe ist eines der Attribute des -Tags, das zum Festlegen der Textfarbe verwendet wird. Erstellen Sie eine Webseitendatei im Verzeichnis D:web, nennen Sie sie „font_color.htm“ und schreiben Sie den Code wie in Code 4.7 gezeigt.
Code 4.7 Einstellung der Schriftfarbe: font_color.htm
Hellroter Text: Die Essenz des HTML-Lernens besteht darin, alles zu verwenden, was es sein soll
Dunkelroter Text: Die Essenz des HTML-Lernens besteht darin, alles zu verwenden, was es sein soll
Hellgrüner Text: Die Essenz des HTML-Lernens besteht darin, alles zu verwenden, was es sein soll
Dunkelgrüner Text: Die Essenz des HTML-Lernens besteht darin, alles zu verwenden, was es sein soll
Hellblauer Text: Die Essenz des HTML-Lernens besteht darin, alles zu verwenden, was es sein soll
Dunkelblauer Text: Die Essenz des HTML-Lernens besteht darin, alles zu verwenden, was es sein soll
Hellgelber Text: Die Essenz des HTML-Lernens besteht darin, alles zu verwenden, was es sein soll
Dunkelgelber Text: Die Essenz des HTML-Lernens besteht darin, alles zu verwenden, was es sein soll
Heller Cyan-Text: Die Essenz des HTML-Lernens besteht darin, alles zu verwenden, was es sein soll
Dunkler Cyan-Text: Die Essenz des HTML-Lernens besteht darin, alles zu verwenden, was es sein soll
Hellvioletter Text: Die Essenz des HTML-Lernens besteht darin, alles zu verwenden, was es sein soll
Dunkelvioletter Text: Die Essenz des HTML-Lernens besteht darin, alles zu verwenden, was es sein soll
Geben Sie http://localhost/font_color.htm in die Adressleiste des Browsers ein. Der Browsing-Effekt ist wie in Abbildung 4.7 dargestellt.
Abbildung 4.7 Einstellung der Schriftfarbe
Leser können nicht nur die Verwendung des Farbattributs im Schriftart-Tag aus Code 4.7 lernen, sondern sich auch mit den Darstellungsmethoden verschiedener Farben vertraut machen.
4.2.3 Textgröße festlegen
size ist auch ein Attribut des -Tags, mit dem die Textgröße festgelegt wird. Der Wert für die Größe liegt zwischen 1 und 7, der Standardwert ist 3. Wir können „+“ oder „-“ Zeichen vor dem Größenattributwert hinzufügen, um die Erhöhung oder Verringerung relativ zum Anfangswert der Schriftgröße anzugeben. Erstellen Sie eine Webseitendatei im Verzeichnis D:web, nennen Sie sie „font_size.htm“ und schreiben Sie den Code wie in Code 4.8 gezeigt.
Code 4.8 Schriftgrößeneinstellung: font_size.htm
Größe ist 1: HTML-Lernen
Größe ist 2: HTML-Lernen
Größe ist 3: HTML-Lernen
Größe ist 4: HTML-Lernen
Größe ist 5: HTML-Lernen
Größe ist 6: HTML-Lernen
Größe ist 7: HTML-Lernen
Geben Sie http://localhost/font_size.htm in die Adressleiste des Browsers ein. Der Browsing-Effekt ist wie in Abbildung 4.8 dargestellt.
Abbildung 4.8 Einstellung der Schriftgröße
Leser können versuchen, „+“- oder „-“-Zeichen vor dem Größenwert hinzuzufügen, um die Textgröße flexibler festzulegen.
4.2.4 Textschriftart festlegen
face ist auch ein Attribut des -Tags, mit dem die Textschriftart (Schriftstil) festgelegt wird. Die auf HTML-Webseiten angezeigten Schriftarten werden vom Browsersystem aufgerufen. Um die Schriftarten konsistent zu halten, wird die Verwendung der Song-Schriftart empfohlen. HTML-Seiten verwenden standardmäßig auch die Song-Schriftart. Erstellen Sie eine Webseitendatei im Verzeichnis D:web, nennen Sie sie „font_face.htm“ und schreiben Sie den Code wie in Code 4.9 gezeigt.
Code 4.9 Schriftarteinstellung: font_face.htm
Die Schriftart ist Song-Stil: Qinyuanchun·Changsha-Mao Zedong
Die Schriftart ist in normaler Schrift: Qinyuanchun·Changsha-Mao Zedong
Die Schriftart ist fett: Qinyuanchun·Changsha-Mao Zedong
Die Schriftart ist die offizielle Schrift: Qinyuanchun·Changsha-Mao Zedong
Geben Sie http://localhost/font_face.htm in die Adressleiste des Browsers ein. Der Browsing-Effekt ist wie in Abbildung 4.9 dargestellt.
Abbildung 4.9 Schriftarteinstellung
Der Autor legt die Textgröße des geänderten Schriftartteils zur Vereinfachung für die Leser auf Größe 5 fest.
4.2.5 Text neigen
Verwenden Sie Doppel-Tags , um den Text zu neigen und so besondere Effekte zu erzielen, beispielsweise das Datum eines Artikels. wird als Hervorhebungs-Tag bezeichnet und wird derzeit häufiger verwendet als das Tag . Seine Schreibweise ist wie folgt:
Dies ist kursiver Text
Dies ist auch kursiver Text
4.2.6 Text fett formatieren
Verwenden Sie doppelte Tags , um den Text fett zu machen, um ihn auffälliger zu machen, z. B. den Titel eines Artikels. wird als besonderes Hervorhebungs-Tag bezeichnet und der Text wird derzeit häufiger verwendet als das -Tag. Die Schreibweise ist wie folgt.
Dies ist fetter Text
Dies ist auch fetter Text
4.2.7 Text unterstreichen
Verwenden Sie das Doppel-Tag , um dem betroffenen Text eine Unterstreichung hinzuzufügen. Hier ist ein umfassendes Beispiel für kursiv geschriebenen, fett gedruckten und unterstrichenen Text. Erstellen Sie eine Webseitendatei im Verzeichnis D:web, nennen Sie sie „font_style.htm“ und schreiben Sie den Code wie in Code 4.10 gezeigt.
Code 4.10 Textänderungseinstellungen: font_style.htm
Kursiv: Qinyuanchun·Changsha-Mao Zedong
Fett: Qinyuanchun·Changsha-Mao Zedong
Unterstrichen: Qinyuanchun·Changsha-Mao Zedong
Kursiv und fett unterstrichen: Qinyuanchun·Changsha-Mao Zedong
Geben Sie http://localhost/font_style.htm in die Adressleiste des Browsers ein. Der Browsing-Effekt ist wie in Abbildung 4.10 dargestellt.
Abbildung 4.10 Einstellungen zur Schriftartänderung
Der Autor legt die Größe des gesamten Textes innerhalb von zur Vereinfachung für die Leser auf Größe 5 fest.
– Hinweis: Wenn mehrere Tags denselben Text enthalten, kann ihre Einschlussreihenfolge nicht falsch platziert werden.
4.2.8 Verwendung mehrerer Titelstile
Um in Webartikeln die Bedeutung des Titels hervorzuheben, ist der Stil des Titels relativ speziell. Die HTML-Technologie schützt eine Reihe von Stil-Tags für Titel, bei denen es sich um Doppel-Tags
bis handelt. Die Textgröße von groß bis klein repräsentiert unterschiedliche Ebenen von Titeln. Das Titel-Tag weist eine Besonderheit auf: Es nimmt eine exklusive Zeile ein, der Text ist fett und der Text ist zentriert. Auf diese Weise ist das Festlegen des Titels sehr einfach und es können mehrstufige Titel festgelegt werden. Erstellen Sie eine Webseitendatei im Verzeichnis D:web, nennen Sie sie „font_h.htm“ und schreiben Sie den Code wie in Code 4.11 gezeigt.
Code 4.11 Titeleinstellung: font_h.htm
Titeleinstellungen
Titel Nr. 1
Titel Nr. 2
Titel Nr. 3
Titel Nr. 4
Titel Nr. 5
Titel Nr. 6
Fortune Magazine: Warum Google nicht gedeihen und dann verfallen wird
Auf potenzielle Probleme stoßen
Code 4.11 Titeleinstellung: font_h.htm
Titel Nr. 1
Titel Nr. 2
Titel Nr. 3
Titel Nr. 4
Titel Nr. 5
Titel Nr. 6
Fortune Magazine: Warum Google nicht gedeihen und dann verfallen wird
Auf potenzielle Probleme stoßen
Einige Leute in der Branche glauben, dass Google, das lange Zeit den Markt für Internetsuche und -werbung monopolisiert hat, florieren und dann sinken könnte. ...Gleichzeitig wurden auch viele neue Pläne von Google in letzter Zeit auf den Weg gebracht, wie etwa die Open Mobile Alliance, die allgemeine Plattform für soziale Netzwerke OpenSocial, und die mögliche Investition von Milliarden Dollar in Ausschreibungen für drahtlose Frequenzbänder vielfach in Frage gestellt.
wird weiterhin die Suche monopolisieren
Kürzlich gab es einige Artikel, die besagen, dass die Leute Google ohne zu zögern verlassen werden, wenn eine bessere Suchmaschine erscheint. Aber selbst wenn eine bessere Suchmaschine auf den Markt kommt, wird es Google noch eine Weile geben. ...In diesem Fall entscheidet oft die Geschwindigkeit der Website über Sieg und Niederlage.
Geben Sie http://localhost/font_h.htm in die Adressleiste des Browsers ein. Der Browsing-Effekt ist wie in Abbildung 4.11 dargestellt.
Abbildung 4.11 Titeleinstellungen
4.2.9 Lernen Sie, mit Sonderzeichen auf Webseiten umzugehen
In HTML haben einige Zeichen eine besondere Bedeutung. Beispielsweise ist „“ die linke und rechte Klammer des Tags, und das Tag steuert die Anzeige von HTML. Das Tag selbst kann nur vom Browser analysiert werden kann auf der angezeigten Seite nicht verwendet werden. Wie wird also „“ in HTML angezeigt? HTML gibt an, wie einige Sonderzeichen geschrieben werden, damit sie auf Webseiten angezeigt werden können, wie in Tabelle 4.1 gezeigt.
Tabelle 4.1 Sonderzeichen in HTML
Spezielle Symbole
HTML-Code
Spezielle Symbole
HTML-Code
<
™ (Markensymbol)
™
>
>
® (Registrierungssymbol)
®
"" (englische Halbbreite)
"
×
×
§
§
© (Copyright-Symbol)
©
Erstellen Sie eine Webseitendatei im Verzeichnis D:web, nennen Sie sie string.htm und schreiben Sie den string.htm-Code wie in Code 4.12 gezeigt.
Code 4.12 Sonderzeicheneinstellungen: string.htm
So zeigen Sie das
-Tag an:
So zeigen Sie Anführungszeichen an: „Englische doppelte Anführungszeichen halber Breite“
So zeigen Sie die Marke an: ™
So zeigen Sie Registrierungssymbole an: ®
So zeigen Sie das Copyright-Symbol an: ©
Zeigen§
Zeige ×
Geben Sie http://localhost/string.htm in die Adressleiste des Browsers ein. Der Browsing-Effekt ist wie in Abbildung 4.12 dargestellt.
Abbildung 4.12 Sonderzeicheneinstellungen
— Hinweis: Um das Symbol & separat anzuzeigen, muss der Code & verwendet werden.
4.2.10 So können Sie das Parsen eines Teils von HTML durch den Browser bequemer ignorieren
Wenn Sie auf einer Webseite ein HTML-Codebeispiel erstellen, das dem in diesem Buch ähnelt, müssen Sie leider alles in < umwandeln, was mühsam erscheint.