Pfeile bei Verweisen?

tom

Hallo,

wie bekomm ich es hin, dass vor Link so ein Pfeil erscheint?

[Blockierte Grafik: http://www.thomas-hoelscher.de/images/ref_pfeil.gif] Link1
[Blockierte Grafik: http://www.instant-thinking.de/theme/images/Icon-Extlink.png] Link 2

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

Waldscheisser

Wo genau?

Wenn du selber Beiträge erstellst, kannst du sie doch direkt einbinden.

Ist zwar etwas mühselig aber es geht!

tom

Hallo,

ich meine bei Verfassen von Beiträgen... Klar, selber einbinden geht, aber es geht doch auch sicher einfacher, oder?

Habe neulich einen Wordpress-Blog gesehn, bei dem das drin war!

zeroK

Naja, du könntest über CSS jedem <a> tag ein Hintergrundbild geben, das so aussieht :)

Code

a:link {
   padding-left:15px;
   background-image:url(pfeil.png);
   background-repeat:none;
}

Das geht halt davon aus, dass das Pfeilbild kleiner schmäler als 15px ist, damits nicht komplett am Text dranhängt :)

tom

Zitat von zeroK
Naja, du könntest über CSS jedem <a> tag ein Hintergrundbild geben, das so aussieht :)
Code
a:link {
   padding-left:15px;
   background-image:url(pfeil.png);
   background-repeat:none;
}
Das geht halt davon aus, dass das Pfeilbild kleiner schmäler als 15px ist, damits nicht komplett am Text dranhängt :)

Ok, und in welchem Ordner müsste dann das Grafik-File liegen?

zeroK

Wo du willst, du musst halt nur in der CSS-Regel auf die Datei verweisen.

tom

also so?

Zitat

a:link {
padding-left:15px;
background-image:url([color=red]http://www.url-to-image/pfeil.png[/color]);
background-repeat:none;

zeroK

Ja zum beispiel. Du kannst den Pfad aber auch relativ zur URL von der CSS-Datei angeben. Wenn die CSS-Datei zb in http://host.com/style.css liegt, und dein Pfeil in http://host.com/images/, dann kannst auch einfach images/pfeil.png nehmen.

tom

Zitat von zeroK

Ja zum beispiel. Du kannst den Pfad aber auch relativ zur URL von der CSS-Datei angeben. Wenn die CSS-Datei zb in http://host.com/style.css liegt, und dein Pfeil in http://host.com/images/, dann kannst auch einfach images/pfeil.png nehmen.

Hallo, klappt leider nicht. Es zerhaut mir dann ALLES im Code, wo der a-Tag vorkommt...

klick

Gibt es einen bestimmten Platz, wo ich den Eintrag in der .css machen muss? Er lautet nun:

Code

a:link {
padding-left:15px;
background-image:url(http://www.thomas-hoelscher.de/images/ref_pfeil.gif);
background-repeat:none;

zeroK

Ich würde das ganz am Schluss hinsetzen. Ausserdem hat sich bei mir leider ein Typo eingeschichen:

Es sollte heißen:

Code

background-repeat:no-repeat;

und vergiss die schließende geschwungene Klammer nicht :)

tom

Hi...

danke, aber es klappt einfach nicht ... kann ich dir meine css mal verlinken? Vielleicht findest du den Fehler...

http://www.thomas-hoelscher.de/wp-content/the…elite/style.css

jottlieb

Bei mir gibt es mit diesem Code keine Probleme:

Code

a, h2 a:hover, h3 a:hover {
	color: #194A74;
	text-decoration: none;
        padding-left:15px; 
        background-image:url(/files/pfeil.gif); 
        background-repeat:no-repeat;
	}

tom

Komisch, wieso klappt es bei allen, nur bei mir nicht? ;)

Ist die css Datei oben denn korrekt? Kann da mal wer nachsehen bitte?

Es wird wohl versucht, das einzufügen, siehe Bild. Die markierten Pfeile habe ich manuell eingebunden, aber es sind Lücken vor den Links nun, und vor "web.de" (im ersten Beitrag) sollte also auch der Pfeil kommen. Ausserdem ist die Farbe der Links nun blau und nicht mehr grün.

http://img363.imageshack.us/my.php?image=unbenannt6jm.jpg

Danke für Eure Tipps!

zeroK

Bei deinem background-image fehlt irgendwie das .de in der URL ;)

tom

oh habs angepasst, aber es sieht nun so aus: http://www.thomas-hoelscher.de

der pfeil soll NUR in einträgen kommen, nicht im menü...

zeroK

Also bei mir sind da jetzt zwei Pfeile für diesen Links ;) Leer mal deinen Browsercache :)

tom

ja, aber jetzt sind die überall?!

zeroK

Ja, wenn du sie nicht überall haben willst, dann musst du die CSS-Regel halt einschränken. Wenn du zum Beispiel die Links so nur in Feldern mit der Klasse "content" haben willst, dann musst du halt sowas z.B. machen:

Code

.content a:link{
...
}

Für Details bitte google mal nach ein paar CSS-Tutorials :)

tom

Danke,

wie genau müsste denn dann der eintrag aussehen?

zeroK

Was meinst du genau? Meinst du in der CSS-Datei oder in deinem Template?

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Pfeile bei Verweisen?

Jetzt mitmachen!