LinkBack URL
About LinkBacksHallo,
wie kann ich es erreichen, das vor jedem Link (<A href...) automatisch ein kleines Bildchen gezeigt wird.
Bsp:
Mehr Infos...
Gruß und Dank
Chr.
Vor jedem Link ein Bildchen
Hallo,
wie kann ich es erreichen, das vor jedem Link (<A href...) automatisch ein kleines Bildchen gezeigt wird.
Bsp:
Gruß und Dank
Chr.
Geändert von christian41 (15.03.2010 um 11:29 Uhr)
Segeln in Holland?
http://www.segler-in-holland.de
Hi,
wenn du ein Bild (img) eingefügt haben willst, geht das leicht per CSS. Du musst dann nur für jeden a. entsprechend definieren. Helfen kann dir sicher www.css4you.de. Hier findest du CSS-Definitionen und ihre möglichen Parameter.
Möglich wäre also z.B:
Ungefähr so kann der Code aussehen. Habs jetzt aus dem Kopf geschrieben. Ob das so klappt weiß ich jetzt nicht.Code:a.{ background-image: url(url-zum-bild.png} /* Bild als "Hintergrund"*/ background-repeat: no-repeat; /* Hintergrund soll sich nicht wiederholen!*/ background-position: left; /* Bildausrichtung Links*/ margin-left: 16px; /* Abstand links*/ }
Gruß
JamFX
www.nik-o-mat.de -> Freie Software, Joomla-Tipps & Übersetzungen
www.akeebabackup.de ->AkeebaBackup Joomla Umziehen, Sichern, Wiederherstellen [Videoanleitung]
nik-o-mat bei Twitter | Google+ | Facebook
Wenn Du nicht jeden Link (a.) layouten möchtest, könntest Du auch dafür eine extra Klasse anlegen und dieser über den Editor (sofern der Zugriff auf Deine CSS ermöglicht wurde) beim Schreiben vegeben. Der Code von jamfy wäre der selbe, nur die Klasse musst Du neu erstellen.
Ich würde eher ein Padding nehmen.
Kannst Du dazu ein Beispiel nennen?Zitat von a.h.
(Ich gebe zu: Für mich klingt CSS wie ein neues Auto...)
Segeln in Holland?
http://www.segler-in-holland.de
Ein Padding ist ein Innenabstand, ein Margin ein Außenabstand. Da das Bild INNERHALB des Links als Background dient, muss man einen Innenabstand nehmen, sonst wird nicht jeder Browser das sauber rendern.
Der Code von JamFX passt, ich empfehle das Ersetzen von Margin durch Padding.
Du kannst das hier mal ansehen:
http://www.nichtraucherschutz.de/zei...-slash-10.html
das PDF Icon:
a.pdf {
background-image:url("/images/M_images/pdf_button_light_red.gif");
background-position:left center;
background-repeat:no-repeat;
font-weight:bold;
margin-left:5px;
padding-left:21px;
}
Rote Pfeile: Padding
Grüne: Margin
Das Margin sorgt dafür, dass der Text nicht zu sehr an das Icon heranrückt.
Dieses Beispiel markiert nur Links mit der CSS Klasse "PDF".
Der Code für alle Links wäre so, wie es JamFX schrieb:
a {
....
}
Du kannst auch nur alle externen Links markieren mit:oder alle PDF-Links:Code:a[href^="http:"], a[href^="https:"] { padding-left: 12px; background-image: url('../images/ext_link.gif'); background-repeat: no-repeat; background-position: left; }Code:a[href$=".pdf"]:after { font-size: 10px; color: blue; content: " [PDF]"; }
1.) Wenn dann müsstest Du eher auf target _blank filtern, interne Links erzeugt Joomla auch mit http dran, zum Beispiel bei Kategorie-Listen
2.) Das funktioniert nicht in allen Browsern. Viele Unternehmen haben noch den IE6 im Einsatz, was sich nun hoffentlich dank Win7 endlich ändern wird, der kennt diesen Constructor nicht.
Berechtigungen
Zitieren
Lesezeichen