HTML - Schriftarten

Schriftarten spielen eine sehr wichtige Rolle, um eine Website benutzerfreundlicher zu gestalten und die Lesbarkeit von Inhalten zu verbessern. Schriftart und -farbe hängen vollständig von dem Computer und dem Browser ab, mit denen Ihre Seite angezeigt wird. Sie können jedoch HTML verwendenTag, um dem Text auf Ihrer Website Stil, Größe und Farbe hinzuzufügen. Sie können eine verwenden<basefont> Tag, um den gesamten Text auf die gleiche Größe, das gleiche Gesicht und die gleiche Farbe einzustellen.

Das Font-Tag hat drei Attribute size, color, und faceum Ihre Schriftarten anzupassen. Verwenden Sie einfach das -Tag, um die Schriftattribute jederzeit auf Ihrer Webseite zu ändern. Der folgende Text bleibt geändert, bis Sie mit dem -Tag schließen. Sie können eines oder alle Schriftattribute innerhalb eines -Tags ändern.

Note−Die Tags für Schriftarten und Basisschriftarten sind veraltet und sollten in einer zukünftigen HTML-Version entfernt werden. Sie sollten daher nicht verwendet werden. Es wird empfohlen, CSS-Stile zu verwenden, um Ihre Schriftarten zu bearbeiten. In diesem Kapitel werden Schrift- und Basisschriftarten-Tags ausführlich erläutert.

Stellen Sie die Schriftgröße ein

Sie können die Schriftgröße für Inhalte mithilfe von festlegen sizeAttribut. Der Bereich der akzeptierten Werte reicht von 1 (kleinste) bis 7 (größte). Die Standardgröße einer Schriftart ist 3.

Beispiel

<!DOCTYPE html>
<html>

   <head>
      <title>Setting Font Size</title>
   </head>

   <body>
      <font size = "1">Font size = "1"</font><br />
      <font size = "2">Font size = "2"</font><br />
      <font size = "3">Font size = "3"</font><br />
      <font size = "4">Font size = "4"</font><br />
      <font size = "5">Font size = "5"</font><br />
      <font size = "6">Font size = "6"</font><br />
      <font size = "7">Font size = "7"</font>
   </body>

</html>

Dies führt zu folgendem Ergebnis:

Relative Schriftgröße

Sie können angeben, wie viele Größen größer oder wie viele Größen kleiner als die voreingestellte Schriftgröße sein sollen. Sie können es wie angeben oder 

Beispiel

<!DOCTYPE html>
<html>

   <head>
      <title>Relative Font Size</title>
   </head>

   <body>
      <font size = "-1">Font size = "-1"</font><br />
      <font size = "+1">Font size = "+1"</font><br />
      <font size = "+2">Font size = "+2"</font><br />
      <font size = "+3">Font size = "+3"</font><br />
      <font size = "+4">Font size = "+4"</font>
   </body>

</html>

Dies führt zu folgendem Ergebnis:

Schriftart einstellen

Sie können die Schriftart mithilfe des Gesichtsattributs festlegen. Beachten Sie jedoch, dass der Benutzer, der die Seite anzeigt, die Schriftart nicht installiert hat und diese nicht sehen kann. Stattdessen wird dem Benutzer die Standardschriftart angezeigt, die für den Computer des Benutzers gilt.

Beispiel

<!DOCTYPE html>
<html>

   <head>
      <title>Font Face</title>
   </head>

   <body>
      <font face = "Times New Roman" size = "5">Times New Roman</font><br />
      <font face = "Verdana" size = "5">Verdana</font><br />
      <font face = "Comic sans MS" size =" 5">Comic Sans MS</font><br />
      <font face = "WildWest" size = "5">WildWest</font><br />
      <font face = "Bedrock" size = "5">Bedrock</font><br />
   </body>

</html>

Dies führt zu folgendem Ergebnis:

Geben Sie alternative Schriftarten an

Ein Besucher kann Ihre Schriftart nur sehen, wenn er diese Schriftart auf seinem Computer installiert hat. Es ist also möglich, zwei oder mehr Alternativen für Schriftarten anzugeben, indem die Namen der Schriftarten durch Komma getrennt aufgelistet werden.

<font face = "arial,helvetica">
<font face = "Lucida Calligraphy,Comic Sans MS,Lucida Console">

Wenn Ihre Seite geladen wird, zeigt der Browser die erste verfügbare Schriftart an. Wenn keine der angegebenen Schriftarten installiert ist, wird die Standardschriftart Times New Roman angezeigt .

Note - Überprüfen Sie eine vollständige Liste von HTML Standard Fonts.

Festlegen der Schriftfarbe

Sie können eine beliebige Schriftfarbe mithilfe des Farbattributs festlegen . Sie können die gewünschte Farbe entweder durch den Farbnamen oder den Hexadezimalcode für diese Farbe angeben.

Note - Sie können eine vollständige Liste von überprüfen HTML Color Name with Codes.

Beispiel

<!DOCTYPE html>
<html>

   <head>
      <title>Setting Font Color</title>
   </head>
	
   <body>
      <font color = "#FF00FF">This text is in pink</font><br />
      <font color = "red">This text is red</font>
   </body>
	
</html>

Dies führt zu folgendem Ergebnis:

Das <basefont> -Element

Das <basefont> -Element soll eine Standardschriftgröße, -farbe und -schrift für alle Teile des Dokuments festlegen, die ansonsten nicht in einem -Tag enthalten sind. Mit den -Elementen können Sie die <basefont> -Einstellungen überschreiben.

Das <basefont> -Tag akzeptiert auch Farb-, Größen- und Gesichtsattribute und unterstützt die relative Schriftarteneinstellung, indem der Größe ein Wert von +1 für eine größere Größe oder –2 für zwei kleinere Größen zugewiesen wird.

Beispiel

<!DOCTYPE html>
<html>

   <head>
      <title>Setting Basefont Color</title>
   </head>
	
   <body>
      <basefont face = "arial, verdana, sans-serif" size = "2" color = "#ff0000">
      <p>This is the page's default font.</p>
      <h2>Example of the &lt;basefont&gt; Element</h2>
      
      <p><font size = "+2" color = "darkgray">
            This is darkgray text with two sizes larger
         </font>
      </p>

      <p><font face = "courier" size = "-1" color = "#000000">
            It is a courier font, a size smaller and black in color.
         </font>
      </p>
   </body>
	
</html>

Dies führt zu folgendem Ergebnis: