Ergebnis 1 bis 12 von 12
  1. #1
    Avatar von promillo
    promillo ist offline Tripel-As
    registriert
    07-06-2001
    Ort
    rupplyn
    Beiträge
    220

    Imagelink Bordercolor mittels CSS ändern

    Halllo,

    habe folgedens Problem:
    Ich möchte die Bordercolor die ein Bild einfasst ändern. Im Firefox funktioniert das mit folgdendem Beispiel ohne Probleme, nur im IE funktioniert das ganze irgendwie nicht...

    HTML-Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
     <link rel="stylesheet" type="text/css" href="style/style.css">
    </head>
    <body>
    <a href="bild.png" target="_new"><img src="thumb_bild.png" width="50" border="1"></a>
    </body>
    </html>
    Die CSS-Datei dazu:

    HTML-Code:
    body {font-size:9pt; font-family:arial; color:#000000;}
    a {font-size:9pt; font-family:arial; color:#999999; text-decoration:none;}
    a:link {font-size:9pt; font-family:arial; color:#999999; text-decoration:none;}
    a:visited {font-size:9pt; font-family:arial; color:#999999; text-decoration:none;}
    a:active {font-size:9pt; font-family:arial; color:#999999; text-decoration:none;}
    a:hover {font-size:9pt; font-family:arial; color:#ff6600; text-decoration:none;}
    Weiss jemand Rat oder kann mir dabei helfen?

    Gruss & Thx
    promillo

  2. #2
    Avatar von Hawk63
    Hawk63 ist offline Haudegen
    registriert
    05-03-2005
    Ort
    Berlin
    Beiträge
    505

    AW: Imagelink Bordercolor mittels CSS ändern

    Hallo promillo,


    schreibe mal:

    <a href="bild.png" target="_new"><img src="thumb_bild.png" width="50" style="border-left: 1px solid black ; border-top: 1px solid black ; border-right: 1px solid white ; border-bottom: 1px solid white"></a>

    oder nur style="border: 2px solid farbe"
    Hawk63
    -------------------------------------------------------

    -------------------------------------------------------
    Woher soll ich wissen was ich denke, bevor ich höre was ich sage

  3. #3
    Avatar von promillo
    promillo ist offline Tripel-As
    registriert
    07-06-2001
    Ort
    rupplyn
    Beiträge
    220

    AW: Imagelink Bordercolor mittels CSS ändern

    danke hat mir weitergeholfen!

    Zwar fehlt im IE nachwievor dann der Effekt, wenn man mit dem Cursor über das Bild fährt (img:hover tut nicht ), aber zumindest ist die Border nicht mehr blau. Habs folgender Maßen gemacht:

    HTML-Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
    <html>
    <head>
     <link rel="stylesheet" type="text/css" href="style/style.css">
    </head>
    <body>
     <a href="bild.png" target="_new"><img class="blub" src="thumb_bild.png" width="50" border="1"></a> 
    </body>
    </html>
    CSS:

    HTML-Code:
    body {font-size:9pt; font-family:arial; color:#000000;}
    a:link {font-size:9pt; font-family:arial; color:#999999; text-decoration:none;}
    a:visited {font-size:9pt; font-family:arial; color:#999999; text-decoration:none;}
    a:active {font-size:9pt; font-family:arial; color:#999999; text-decoration:none;}
    a:hover {font-size:9pt; font-family:arial; color:#ff6600; text-decoration:none;}
    img.blub { border-left: 1px solid #999999; border-top: 1px solid #999999; border-right: 1px solid #999999; border-bottom: 1px solid #999999 }
    img.blub:hover { border-left: 1px solid #ff6600; border-top: 1px solid #ff6600; border-right: 1px solid #ff6600; border-bottom: 1px solid #ff6600 }
    Denn Hover-Effekt würde man höchstwahrscheinlich nur mit einem JavaScript hinbekommen, was ich aber vermeiden wollte, da ich kein JavaScript einsetzen möchte. Haben die IE-User halt pech gehabt

    gruss
    promillo

  4. #4
    Avatar von dkdenz
    dkdenz ist offline Foren-Gott
    registriert
    13-04-2004
    Ort
    Lübeck
    Beiträge
    12.050

    AW: Imagelink Bordercolor mittels CSS ändern

    Der IE zeigt nur hover-Reaktionen,
    wenn es sich um das <a>-Tag handelt.
    Da Du das Pic als Link nutzt, kann man da schon was machen.
    Du musst nur Deine CSS etwas umstellen.
    Code:
    a:link {font-size:9pt; font-family:arial; color:#999; text-decoration:none; border: 0px;}
    a:visited {font-size:9pt; font-family:arial; color:#999; text-decoration:none;border: 0px;}
    a:hover {font-size:9pt; font-family:arial; color:#ff6600; text-decoration:none; border: 1px solid #ff6600;}
    a:active {font-size:9pt; font-family:arial; color:#999; text-decoration:none; border: 0px;}
    Wenn Du die Link-CSS auch noch für Textlinks nutzt,
    musst Du einfach obigem Bsp. eine class zuweisen.
    Code:
    a.img:link {font-size:9pt; font-family:arial; color:#999; text-decoration:none; border: 0px;}
    a.img:visited {font-size:9pt; font-family:arial; color:#999; text-decoration:none; border: 0px;}
    a.img:hover {font-size:9pt; font-family:arial; color:#ff6600; text-decoration:none; border: 1px solid #ff6600;}
    a.img:active {font-size:9pt; font-family:arial; color:#999; text-decoration:none; border: 0px;}
    Code:
    <a class="img" href="bild.png" target="_new"><img class="blub" src="thumb_bild.png" width="50" height="50"></a>
    Dan darf natürlich auch kein border="1px" drinstehen.
    Und auf die Reihenfolge der Links achten:
    a:link
    a:visited
    a:hover
    a:active

  5. #5
    Avatar von promillo
    promillo ist offline Tripel-As
    registriert
    07-06-2001
    Ort
    rupplyn
    Beiträge
    220

    AW: Imagelink Bordercolor mittels CSS ändern

    hm dein Tip funktioniert, wobei beim hover dann das Bild immer "zuckt", wenn man mit dem Cursor drüberfährt. Zusätzlich gibts im Firefox eine seltsame zusätzlich Box beim hover (siehe Anhang), ist wohl die border die bei a:hover angegeben wurde
    Angehängte Grafiken Angehängte Grafiken

  6. #6
    Avatar von dkdenz
    dkdenz ist offline Foren-Gott
    registriert
    13-04-2004
    Ort
    Lübeck
    Beiträge
    12.050

    AW: Imagelink Bordercolor mittels CSS ändern

    Probiere dann mal einfach bei den anderen Bezeichnungen border zu setzen,
    aber in der Hintergrundfarbe Deiner Site.
    Bsp.:
    Code:
    a:link {font-size:9pt; font-family:arial; color:#999; text-decoration:none; border: 1px solid #fff;}
    a:visited {font-size:9pt; font-family:arial; color:#999; text-decoration:none;border: 1px solid #fff;}
    a:hover {font-size:9pt; font-family:arial; color:#ff6600; text-decoration:none; border: 1px solid #ff6600;}
    a:active {font-size:9pt; font-family:arial; color:#999; text-decoration:none; border: 1px solid #fff;}

  7. #7
    Avatar von dkdenz
    dkdenz ist offline Foren-Gott
    registriert
    13-04-2004
    Ort
    Lübeck
    Beiträge
    12.050

    AW: Imagelink Bordercolor mittels CSS ändern

    Und noch ein Tipp:
    schreib in Deine CSS rein:
    Code:
    img {
                       border:0px;
                       }

  8. #8
    Avatar von promillo
    promillo ist offline Tripel-As
    registriert
    07-06-2001
    Ort
    rupplyn
    Beiträge
    220

    AW: Imagelink Bordercolor mittels CSS ändern

    also im IE passts, nur bleibt diese seltsame box bleibt im firefox erhalten, ich glaube ich lebe einfach so damit, IE user haben halt pech, hehe... oder halt ne browserweiche und entsprechende CSS-Dateien dann verlinken...

  9. #9
    Avatar von dkdenz
    dkdenz ist offline Foren-Gott
    registriert
    13-04-2004
    Ort
    Lübeck
    Beiträge
    12.050

    AW: Imagelink Bordercolor mittels CSS ändern

    Das kann's doch nicht sein...
    Hast Du eventuell einen Online-Link?
    Dann könnte ich Dir effektivere Lösungsvorschläge geben...

  10. #10
    Avatar von promillo
    promillo ist offline Tripel-As
    registriert
    07-06-2001
    Ort
    rupplyn
    Beiträge
    220

    AW: Imagelink Bordercolor mittels CSS ändern

    so sollte es aussehn, funktioniert im firefox, im IE keine Änderung:
    http://egg4.net/demo/fox.html


    so funktionierts im IE, dafür kommt im Firefox diese seltsame Box:
    http://egg4.net/demo/ie.html

  11. #11
    Avatar von dkdenz
    dkdenz ist offline Foren-Gott
    registriert
    13-04-2004
    Ort
    Lübeck
    Beiträge
    12.050

    AW: Imagelink Bordercolor mittels CSS ändern

    Seltsame Geschichte...
    Code:
     <a href="bild.jpg" target="_new"><img class="docs" src="bild.jpg" width="500" border="1">
    border solltest Du raus nehmen...
    height hinzufügen...

    das:
    Code:
     border-left: 1px solid #999999; border-top: 1px solid #999999; border-right: 1px solid #999999; border-bottom: 1px solid #999999
    kürzt Du ab in:
    Code:
    border:1px solig #999;
    Habe grade reloaded, jetzt geht's doch, oder?

  12. #12
    Avatar von promillo
    promillo ist offline Tripel-As
    registriert
    07-06-2001
    Ort
    rupplyn
    Beiträge
    220

    AW: Imagelink Bordercolor mittels CSS ändern

    so in beiden eingebaut, gleicher effekt wie vorher...

Ähnliche Themen

  1. Bitte helfen: Liste nützlicher Tools für Web-Designer
    Von vf-design im Forum Allgemeines
    Antworten: 31
    Letzter Beitrag: 08-12-2013, 13:34
  2. gleiche css datei, unterschiedliche anzeige
    Von baxist im Forum CSS und (X)HTML
    Antworten: 6
    Letzter Beitrag: 13-01-2005, 16:35
  3. Antworten: 37
    Letzter Beitrag: 02-08-2004, 21:53
  4. webgallerie mit css positionieren
    Von jsgreenhorn im Forum Allgemeines
    Antworten: 13
    Letzter Beitrag: 09-12-2003, 14:04
  5. Serverseitiges css
    Von H34d im Forum Allgemeines
    Antworten: 4
    Letzter Beitrag: 19-10-2003, 14:42

Lesezeichen

Berechtigungen

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