Ergebnis 1 bis 7 von 7

Thema: Text und Grafik als Link

  1. #1
    Teeny
    Registriert seit
    06.03.2008
    Beiträge
    41
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Text und Grafik als Link

    Hallo zusammen,

    ich versuche gerade einen Grafiklink zu erstellen, auf dem auch noch Text liegt. Also eine Grafik als Link, aber über dieser Grafik soll auch noch ein Text liegen.

    Ich bekomme das einfach nicht hin. Der Text wird auf der Grafik angezeigt, aber der Link funktioniert nicht.

    Vielleicht wird es mit dem Code klarer:

    HTML-Code:
    <a href="http://www.musterseite/muster.php"><div style="height:136px; width:167px; background: url(http://www.musterseite/images/mustergrafik.gif);"><div style="padding:10px 0 0 10px;"><span style="font-size: 1.2em; font-family: trebuchet ms,geneva; color: #ffffff;">Text über Grafik</span></div></div></a>
    Die Grafik wird angezeigt. Der Text auf der Grafik wird auch angezeigt. Nur der Link funktioniert nicht. Es scheint so, als wenn der Browser das <a.....></a>einfach rausschmeißen würde.

    Hat jemand eine Ahnung, woran das liegen könnte oder wie man das umsetzen kann?

    Grüße Sven
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Fortgeschrittene/r Avatar von unknownsoldier
    Registriert seit
    16.06.2010
    Ort
    "Dreamland"
    Alter
    26
    Beiträge
    174
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Text und Grafik als Link

    HTML-Code:
    <a href="www.google.de" style="background: url(http://www.musterseite/images/mustergrafik.gif); color: #fff; display:block; font-size:1.2em; font-family Trebuchet ms, geneva; height 136px; line-height:136px; text-align:center; width 167px;" >Text über Grafik</a>
    Kleiner Tipp:
    Lager das CSS in in den Head oder noch besser in eine externe Datei aus:
    HTML-Code:
    <a href="#" id="linkID">Text über Grafik </a>
    CSS:
    Code:
    background: url(http://www.musterseite/images/mustergrafik.gif); 
    color: #fff; 
    display:block; 
    font-size:1.2em; 
    font-family Trebuchet ms, geneva; 
    height 136px; 
    line-height:136px; 
    text-align:center; 
    width 167px;

  3. #3
    Teeny
    Themenstarter

    Registriert seit
    06.03.2008
    Beiträge
    41
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Text und Grafik als Link

    Hallo,

    vielen Dank. Das funktioniert soweit. Allerdings habe ich nun ein weiteres Problem. Ich versuche nun zwei solcher Konstrukte nebeneinander zu platzieren. Das gelingt aber leider nicht. Sie erscheinen immer versetzt untereinander.

    Woran könnte das liegen?

    HTML-Code:
    <div style="width: 364px; height: 136px; position: relative; left: 50%; margin-left: -182px;"><div style="float: left;"><a style="background:  url('http://www.muster/images/muster.gif');  color: #ffffff; display: block; font-size: 1.3em; font-family: Trebuchet  MS,sans-serif; font-weight: bold; height: 136px; width: 167px;  text-decoration: none;" href="seite.html"></div><div style="float: left; margin-left: 30px;"><a style="background:  url('http://www.muster/images/muster.gif');  color: #ffffff; display: block; font-size: 1.3em; font-family: Trebuchet  MS,sans-serif; font-weight: bold; height: 136px; width: 167px;  text-decoration: none;" href="seite.html"></div></div>
    Das CSS werde ich in eine layout. css auslagern.

    Grüße
    Sven

  4. #4
    Unregistriert
    Gast

    Standard AW: Text und Grafik als Link

    Hat dir irgend´jemand mal gesagt, dass es besser ist, eine Zeile voll zu packen bis zum geht nicht mehr? Und wenn man dann den ganzen CSS-Kram in eine externe Datei packt, könnte das so aussehen:
    Code:
    <div class="class1">
      <div class="class2">
        <a class="class3" href="seite.html">
      </div>
      <div class="class4">
        <a class="class3" href="seite.html">
      </div>
    </div>
    Und schon fällt auf, dass deine Links kaputt sind. Kann so einfach sein, wenn man ordentlich macht.

  5. #5
    Fortgeschrittene/r Avatar von unknownsoldier
    Registriert seit
    16.06.2010
    Ort
    "Dreamland"
    Alter
    26
    Beiträge
    174
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Text und Grafik als Link

    Lern Grundlagen !!!
    -> google

  6. #6
    Teeny
    Themenstarter

    Registriert seit
    06.03.2008
    Beiträge
    41
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Text und Grafik als Link

    Hallo,

    danke, ich habs!

    In Zukunft werde ich meine Fragen nicht mehr im Forum stellen, sondern bei Google, dann braucht ihr euch über "dumme" Fragen nicht mehr aufzuregen.

    Beste Grüße

  7. #7
    Fortgeschrittene/r Avatar von unknownsoldier
    Registriert seit
    16.06.2010
    Ort
    "Dreamland"
    Alter
    26
    Beiträge
    174
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Text und Grafik als Link

    Es lag nicht an der Frage, sondern einfach nur daran das man gewisse Grundlagen beherrschen sollte und dann wenn man nicht weiterkommt fragen kann.

Ähnliche Themen

  1. ein Link-Text ragt über die hinterlegte Grafik heraus
    Von andynail im Forum HTML & CSS Forum
    Antworten: 9
    Letzter Beitrag: 02.09.2010, 15:42
  2. Text mittig von Grafik setzen
    Von davidos_no.1 im Forum HTML & CSS Forum
    Antworten: 6
    Letzter Beitrag: 29.03.2009, 18:29
  3. Bild, Text und Grafik Schutz
    Von mugla1978 im Forum Forum für Grafiken und Bildbearbeitung
    Antworten: 14
    Letzter Beitrag: 06.11.2005, 21:43
  4. Text auf Grafik
    Von Sicarius im Forum Forum für Grafiken und Bildbearbeitung
    Antworten: 6
    Letzter Beitrag: 22.07.2005, 23:14
  5. Text neben Grafik
    Von TurboELK im Forum HTML & CSS Forum
    Antworten: 6
    Letzter Beitrag: 21.05.2005, 15:29

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •