[CSS] "Linkmarkierung" durch Bilder

**Wurzel** · 21.12.2003, 12:21

lass es als liste laufen (ul, li), dann kannst du das symbol vergeben

**TobiaZ** · 21.12.2003, 12:23

Die Überlegung hatte ich auch schon. Allerdings
1) springt der bei <li> in eine neue Zeile, (müsste ich also mit display anpassen oder so)
2) ist li schon belegt, müsste ich klassen verwenden, was ich im fließtext nicht machen wollte.

also vermutlich doch der weg über html.

**Abraxax** · 21.12.2003, 12:27

du kannst auch bei links mit css ein bild davor definieren.

**TobiaZ** · 21.12.2003, 12:31

also auf die LI-Methode?

list-style-image: url(/link.gif);

mussu mir mal erklären.

**Abraxax** · 21.12.2003, 12:39

mhm. vielleicht gehts ja doch nicht mit href's direkt..

Code:

li.pic
{
  list-style-image: url(/link.gif);
  display: inline;
}
<li class="pic"><a href="blubb.html">hier hin</a></li>

geht das?

**the.gatekeeper** · 21.12.2003, 12:45

weiß nicht ob dir das hilft, funkt glaub ich auch nicht mit jedem Browser:

drweb link

sieh auch bei CSS Technik nach!

mfg

**Wurzel** · 21.12.2003, 12:52

@haxe
ist in etwa das was ich meinte

@gatekeeper

Diese Angaben werden vom Internet Explorer 5.x noch nicht interpretiert (selfHTML)

**TobiaZ** · 21.12.2003, 12:52

@abraxax: diese methode hatte ich ja auch schon in erwägung gezogen. allerdings müsste ich da auf classen zurückgreifen, was ich nicht will (kann) und musste grade feststellen, dass display in dem fall keinen einfluss hat (zumindest nicht den gewünschten)

@gatekeeper: danke für den Link. das halte ich auch für die einzige möglichkeit. version 2.0 ist ja so unverbreitet ja auch nicht mehr. die Linkmarkierung wäre ohnehin nur zusatz. wenn ich keinen besseren vorschlag bekomme, werde ich den nehmen,

oder es einfach weg lassen.

**Abraxax** · 21.12.2003, 12:54

Original geschrieben von TobiaZ
[...] allerdings müsste ich da auf classen zurückgreifen, [...]

du kannst es auch als style="..." in jeden link schreiben...

aber inwiefern bringt das mit dem display nichts?

**the.gatekeeper** · 21.12.2003, 12:55

das folgende glaub ich, hab ich auch schon mal bentuzt sollte auch mit den meisten browsern funktionieren:

Code:

A.link:before {content:'inhalte eben ';}

das hier sollte die passende seite sein

PS: bin drweb fan, man merkt's???

**Wurzel** · 21.12.2003, 12:58

und für listen, sei das hier empfohlen : http://www.alistapart.com/articles/taminglists

**TobiaZ** · 21.12.2003, 13:08

seems to work how it should:

Code:

A:before {
  content: url(/link.gif);
}

not so in ie. (den ihr pesch!)

dafür macht der mozilla n bisschen mucken mit den listen. aber dafür hat Wurzel ja ne nette Seite gepostet. Danke euch!

**wahsaga** · 21.12.2003, 16:10

warum du nicht mit klassen arbeiten kannst/willst, verstehe ich aber immer noch nicht so ganz ...

musst ja nicht jedem <a> eine klasse verpassen, über CSS-selektoren lässt sich da ja auch noch einiges machen, wenn du z.b. ein übergeordnetes element hast, dem du die klasse zuweist.

<div class="blah">
text ...
text ...
<a href="...">link</a>
text ...
<a href="...">link</a>
text ...
</div>

#blah a { ... }

und bezüglich des bildes könntest du dann evtl. ja auch mit einem nicht-kachelnden, links positionierten hintergrundbild für die links arbeiten, und dazu den links ein entsprechendes padding-left verpassen ... das könnte auch im IE funktionieren, im gegensatz zu :before, was dieser definitiv nicht beherrscht.

[CSS] "Linkmarkierung" durch Bilder