Tutorialwelt.de » CSS Text unterstreichen http://www.tutorialwelt.de Tutorials aus der IT-Welt Sat, 22 May 2010 13:24:43 +0000 http://wordpress.org/?v=2.8.6 en hourly 1 CSS Tutorial – Per CSS einen Text doppelt unterstreichen http://www.tutorialwelt.de/455/css-tutorial-per-css-einen-text-doppelt-unterstreichen.htm http://www.tutorialwelt.de/455/css-tutorial-per-css-einen-text-doppelt-unterstreichen.htm#comments Sun, 22 Nov 2009 23:32:22 +0000 admin http://www.tutorialwelt.de/?p=455
  • CSS-Tutorial – per CSS Text unterstreichen und durchstreichen – text-decoration Heute möchte ich Ihnen zeigen, wie man per CSS einen...
  • CSS-Tutorial – Text per CSS horizontal ausrichten Heute möchte ich Ihnen zeigen, wie Sie per CSS einen...
  • CSS Tutorial – Per CSS Text in Schrägschrift darstellen – italic, oblique Heute möchte ich Euch zeigen, wie man per CSS einen...
    • Ähnliche Artikel bereitgestellt von Yet Another Related Posts Plugin.]]>     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.

    Related posts:

    1. CSS-Tutorial – per CSS Text unterstreichen und durchstreichen – text-decoration Heute möchte ich Ihnen zeigen, wie man per CSS einen...
    2. CSS-Tutorial – Text per CSS horizontal ausrichten Heute möchte ich Ihnen zeigen, wie Sie per CSS einen...
    3. CSS Tutorial – Per CSS Text in Schrägschrift darstellen – italic, oblique Heute möchte ich Euch zeigen, wie man per CSS einen...

    Ähnliche Artikel bereitgestellt von Yet Another Related Posts Plugin.

    ]]>     http://www.tutorialwelt.de/455/css-tutorial-per-css-einen-text-doppelt-unterstreichen.htm/feed 0     CSS-Tutorial – per CSS Text unterstreichen und durchstreichen – text-decoration http://www.tutorialwelt.de/441/css-tutorial-text-decoration.htm http://www.tutorialwelt.de/441/css-tutorial-text-decoration.htm#comments Sat, 21 Nov 2009 23:31:47 +0000 admin http://www.tutorialwelt.de/?p=441 per CSS einen Text durchstreichen, unterstreichen und überstreichen kann. Hierzu verwendet man die CSS Eigenschaft text-decoration. Für text-decoration gibt es fünf mögliche Werte.... Related posts:
    1. CSS Tutorial – Per CSS einen Text doppelt unterstreichen Heute möchte ich Ihnen zeigen, wie Sie per CSS einen...
    2. CSS-Tutorial per CSS Text in Fettschrift umformatieren Heute möchte ich Euch zeigen, wie man per CSS einen...
    3. CSS Tutorial – Per CSS Text in Schrägschrift darstellen – italic, oblique Heute möchte ich Euch zeigen, wie man per CSS einen...
    Ähnliche Artikel bereitgestellt von Yet Another Related Posts Plugin.]]>     CSS-Tutorial – per CSS Text unterstreichen und durchstreichen

    text-decoration

    Heute möchte ich Ihnen zeigen, wie man per CSS einen Text durchstreichen, unterstreichen und überstreichen kann.

    Hierzu verwendet man die CSS Eigenschaft text-decoration.

    Für text-decoration gibt es fünf mögliche Werte:

    • none – Ohne besondere Eigenschaft
    • underline – Der Text wird unterstrichen
    • overline – Der Text wird überstrichen
    • line-through – Der Text wird durchgestrichen
    • blink – Der Text blinkt

    Hier ein Beispielcode:

    Beispielcode HTML:

    <html>
 <head>
  <style type="text/css">
   .unterstrichen { text-decoration:underline; }
   .ueberstrichen { text-decoration:overline; }
   .durchgestrichen { text-decoration:line-through; }
   .blinkend { text-decoration:blink; }
  </style>
 </head>
 <body>
   Von diesem Text möchte ich folgende Passage in unterstrichen anzeigen lassen:<br>
   <span class="unterstrichen">Dieser Text sollte unterstrichen sein</span><br>
   <span class="ueberstrichen">Dieser Text sollte überstrichen sein</span><br>
   <span class="durchgestrichen">Dieser Text sollte durchgestrichen sein</span><br>
   <span class="blinkend">Dieser Text sollte blinken. Aber nicht im internet Explorer. Denn der Internet Explorer kennt den Wert blink nicht.</span><br>
 </body>
</html>

    Related posts:

    1. CSS Tutorial – Per CSS einen Text doppelt unterstreichen Heute möchte ich Ihnen zeigen, wie Sie per CSS einen...
    2. CSS-Tutorial per CSS Text in Fettschrift umformatieren Heute möchte ich Euch zeigen, wie man per CSS einen...
    3. CSS Tutorial – Per CSS Text in Schrägschrift darstellen – italic, oblique Heute möchte ich Euch zeigen, wie man per CSS einen...

    Ähnliche Artikel bereitgestellt von Yet Another Related Posts Plugin.

    ]]>     http://www.tutorialwelt.de/441/css-tutorial-text-decoration.htm/feed 0