Der folgende Beitrag wurde am 29. 01. 2008, 10:05 Uhr von Maria Magdalena veröffentlicht.
Hallo!
Ich möchte gerne eine Überschrift über die Länge der Buchstaben und in einer anderen Farbe als die Überschrift selbst unterstreichen.
Das Problem ist, daß mit 'underline' die Linie zwar so lange wie die Überschrift ist, aber immer nur in der selben Farbe wie der Text, weil man der underline-Linie keine eigene Farbe zuweisen kann...
... und mit 'border-bottom' kann ich zwar die Farbe der Linie unter der Überschrift ändern, da ist dann aber die Linie nicht nur unter den Buchstaben, aus denen die Überschrift besteht, sondern geht über die komplette Breite des Bereichs, in dem die Überschrift steht. :-(
FRAGE : Ist es möglich, daß ich mit CSS einer Überschrift eine Unterstreichung in ANDERER Farbe UND in Breite der Überschrift geben kann?
Danke
Maria Magdalena
Der folgende Beitrag wurde am 29. 01. 2008, 10:17 Uhr von Picco veröffentlicht.
1.lösung:
gibt es ein underline-color?
2.lösung
eine grafik hinter die überschriften machen wo unten eben die linie ist
3. Lösung die ganze überschrift als grafik machen^^
Der folgende Beitrag wurde am 29. 01. 2008, 10:24 Uhr von Maria Magdalena veröffentlicht.
Hi!
> 1.lösung:
> gibt es ein underline-color?
Nein. Und _ICH_ bin in dem Thread der Fragensteller! ;-)
> 2.lösung
> eine grafik hinter die überschriften machen wo unten eben die linie ist
Nein. Auch da geht die Linie dann über die komplette Breite.
> 3. Lösung die ganze überschrift als grafik machen^^
Das ist das Unsinnigste überhaupt in Bezug auf Usability.
Maria Magdalena
Der folgende Beitrag wurde am 29. 01. 2008, 10:21 Uhr von Matze veröffentlicht.
Hallo,
> ... und mit 'border-bottom' kann ich zwar die Farbe der Linie unter der Überschrift ändern, da ist dann aber die Linie nicht nur unter den Buchstaben, aus denen die Überschrift besteht, sondern geht über die komplette Breite des Bereichs, in dem die Überschrift steht. :-(
welches Element hast du denn benutzt? Also das, dem du den Border gegeben hast?
Ich habs jetzt nicht getestet, aber evtl. geht es wenn du dem h-Element display:block gibst und dann border-bottom.
Grüße, Matze
Der folgende Beitrag wurde am 29. 01. 2008, 10:22 Uhr von Maria Magdalena veröffentlicht.
Hi Matze!
> evtl. geht es wenn du dem h-Element display:block gibst und dann border-bottom.
Das hab ich natürlich versucht. Nein, auch dann geht die Linie über die komplette Breite.
Leider. :-(
Maria Magdalena
Der folgende Beitrag wurde am 29. 01. 2008, 10:31 Uhr von Matze veröffentlicht.
Hallo,
> Das hab ich natürlich versucht. Nein, auch dann geht die Linie über die komplette Breite.
sorry, meinte inline.
h1 {
display:inline;
border-bottom:1px solid black;}
h2 {
display:inline;
border-bottom:1px solid red;}
h3 {
display:inline;
border-bottom:1px solid yellow;}
<h1>Schwarz</h1><br />
<h2>Rot</h2><br />
<h3>Gelb</h3><br />
Grüße, Matze
Der folgende Beitrag wurde am 29. 01. 2008, 10:29 Uhr von Maria Magdalena veröffentlicht.
Den Denkanstoß hat mir Matze gegeben mit seinem :
> evtl. geht es wenn du dem h-Element display:block gibst und dann border-bottom.
Das ist natürlich Unsinn, weil h1 _IST_ ja schon ein Blocklevel-Element. Und da fiel der Groschen : Was ist, wenn man aber aus dem h ein Inline-Element macht? Bingo!
Mit h als Inlineelement und einem border-bottem erreiche ich genau das, was ich wollte.
Danke für den Denkanstoß!
Maria Magdalena
Der folgende Beitrag wurde am 29. 01. 2008, 10:32 Uhr von stareagle veröffentlicht.
Moin,
> FRAGE : Ist es möglich, daß ich mit CSS einer Überschrift eine Unterstreichung in ANDERER Farbe UND in Breite der Überschrift geben kann?
Ja. http://www.css4you.de/trickkiste/tr00001.html
Gruß
Stareagle
Der folgende Beitrag wurde am 29. 01. 2008, 10:38 Uhr von Gunnar Bittersmann veröffentlicht.
@@Maria Magdalena:
> ... und mit 'border-bottom' kann ich zwar die Farbe der Linie unter der Überschrift ändern, da ist dann aber die Linie nicht nur unter den Buchstaben, aus denen die Überschrift besteht, sondern geht über die komplette Breite des Bereichs, in dem die Überschrift steht. :-(
Dann enge den Bereich ein:h1
{
float: left;
border-bottom: 1px solid red;
}
Damit das nachfolgende Element nicht um die Überschrift floatet:h1+*
{
clear: left
}
_I_redend_E_in Browser ist allerdings zu blöd für den Selektor für Nachfahren; also den nachfolgenden Elementtypen (bzw. das nachfolgende Element) explizit angeben.
Live long and prosper,
Gunnar
--
„Das Internet ist ein großer Misthaufen, in dem man allerdings auch kleine Schätze und Perlen finden kann.“ (Joseph Weizenbaum)
© 1998-2013 SELFHTMLImpressumSoftware: Classic Forum 3.4