0 8781

CSS-Tutorial – per CSS einen Text doppelt unterstreichen

Heute möchte ich Ihnen zeigen, wie Sie per CSS einen Text doppelt unterstreichen können.

CSS hat hierzu keine eigene Methode. Zumindest bislang noch nicht.

Es gibt allerdings trotzdem eine Möglichkeit, einen Text per CSS doppelt zu unterstreichen. Wir setzen hierzu die Eigenschaft border ein.

Border verwendet man, um Rahmenlinien (beispielsweise bei einer Tabelle) zu zeichnen.

Mit border-bottom kann man per CSS festlegen, daß man NUR die untere Randlinie bearbeiten möchte.

Eine border Eigenschaft kann den Wert double haben. Der Wert double legt fest, daß eine doppelte Linie gezogen werden soll.

Den Text, den wir doppelt unterstreichen möchten, setzen wir in einen Span Container.

Beispielcode HTML:

<html>
 <head>
  <style type="text/css">
   .double_underline {
                  border-bottom: double 3px #000000;
   }
  </style>
 </head>
 <body>
  Ich möchte <span class="double_underline">diesen Text doppelt unterstrichen haben</span>.
 </body>
</html>

Ich habe diese Lösung im aktuellen Firefox, Opera und Internet Explorer getestet. Es hat in allen drei Browsern einwandfrei funktioniert.

Hier könnt Ihr ein wenig live experimentieren:

See the Pen ogxRoo by Andreas Lang (@sphinxflash) on CodePen.

Wenn Ihr wissen möchtet, wie man einen Text einfach unterstreichen, überstreichen, durchstreichen oder blinkend darstellen kann, dann könnt Ihr über diesen Link auf das passende Tutorial kommen: CSS Text unterstreichen, durchstreichen, überstreichen, blinkend darstellen.

No related posts.

Author: Andreas Lang

Sphinx-Flashdesign.de

Andreas Lang hat im Alter von 12 Jahren begonnen, auf einem Atari ST 1040 STFM in Omikron und STOS Basic zu programmieren.
Spiele interessierten ihn nicht so sehr.
Die Welt der Bits und Bytes hat ihn gefangen.
Programmierertechnisch folgten auf dem ersten 486er Turbo Pascal, Visual Basic.
Mit dem ersten Internet Anschluss per 56k Modem folgten HTML, Javascript, CSS und Macromedia Flash. Die Website www.wizzquiz.de wurde geboren.
Eine Flash Online-Gaming Plattform mit Quiz Spielen, Memory, Sokoban etc.
Später entwickelte er Software unter anderem für Continentale und Siemens AG.
Seit zwei Jahrzehnten konzentriert er sich auf die Webentwicklung und Webdesign mit dem Schwerpunkt PHP, Laravel und Javascript und betreut seine Kunden mit Herz und Seele in allen Bereichen von Entwicklung, Design, Suchmaschinenoptimierung, IT-Recht, IT-Sicherheit etc.

Weiter