• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Rahmen um bild link entfernen ???

Fr3gg3L

Neues Mitglied
Hi Leutz hab schon gegogogelt etc. aber noch keine lösung für mein prob gefunden,

ich erstelle meine navigation mit photoshop, und habe immer das prob das unter firefox immer ein kleiner blauer und roter rahmen um meine bilderlinks entstehen, habe schon im stylesheet
Code:
img {border: 0;}
und dieverse andere border einstellungen probiert,
Code:
a border.... und a border img ...
aber nichts funzt nehme mal an das es daran liegt das ich die navi mit photoshop mache und einfach include.
die angaben im stylesheet funktionierten auch, wenn ich border auf 10 setzt hab ich nen border von 10px aber halt zusätzlich noch diesen standart rahemn in blau rot.
es muss doch irgendwie zu unterdrücken sein. hier mal code von der navi (erstellt mit photoshop)
im zweiten post weil zu lang :) hab oben head bereich etwas kürzen müssen ... war aber nur standart
achja ein dankeschön nochmal an die jenigen sie mich zu der arbeit mit css angespornt haben hat gefruchtet :) und mach auch spass :p
 
Werbung:
Code:
[CODE]
<!-- ImageReady Preload Script (1024_navi.psd) -->
<script type="text/javascript">
<!--

function newImage(arg) {
    if (document.images) {
        rslt = new Image();
        rslt.src = arg;
        return rslt;
    }
}

function changeImages() {
    if (document.images && (preloadFlag == true)) {
        for (var i=0; i<changeImages.arguments.length; i+=2) {
            document[changeImages.arguments[i]].src = changeImages.arguments[i+1];
        }
    }
}

var preloadFlag = false;
function preloadImages() {
    if (document.images) {
        id1024_navi_Shape_3_copy_7_over = newImage("images/1024_navi_Shape-3-copy-7-ov.gif");
        id1024_navi_Shape_3_copy_7_down = newImage("images/1024_navi_Shape-3-copy-7-do.gif");
        id1024_navi_Shape_3_copy_5_over = newImage("images/1024_navi_Shape-3-copy-5-ov.gif");
        id1024_navi_Shape_3_copy_5_down = newImage("images/1024_navi_Shape-3-copy-5-do.gif");
        id1024_navi_Shape_3_copy_4_over = newImage("images/1024_navi_Shape-3-copy-4-ov.gif");
        id1024_navi_Shape_3_copy_4_down = newImage("images/1024_navi_Shape-3-copy-4-do.gif");
        id1024_navi_Shape_3_copy_over = newImage("images/1024_navi_Shape-3-copy-over.gif");
        id1024_navi_Shape_3_copy_down = newImage("images/1024_navi_Shape-3-copy-down.gif");
        id1024_navi_Shape_3_copy_2_over = newImage("images/1024_navi_Shape-3-copy-2-ov.gif");
        id1024_navi_Shape_3_copy_2_down = newImage("images/1024_navi_Shape-3-copy-2-do.gif");
        preloadFlag = true;
    }
}

// -->
</script>
<!-- End Preload Script -->

</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onload="preloadImages();">
<!-- ImageReady Slices (1024_navi.psd) -->
<table id="Table_01" width="225" height="811" border="0" cellpadding="0" cellspacing="0">
    <tr>
        <td colspan="7">
            <img src="images/1024_navi_01.gif" width="224" height="5" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="5" alt=""></td>
    </tr>
    <tr>
        <td colspan="3">
            <img src="images/1024_navi_02.gif" width="9" height="63" alt=""></td>
        <td colspan="3" rowspan="2">
            <a href="javascript:void(0);" onclick="sndReq('getSeite1');"
                onmouseover="changeImages('id1024_navi_Shape_3_copy_7', 'images/1024_navi_Shape-3-copy-7-ov.gif'); return true;"
                onmouseout="changeImages('id1024_navi_Shape_3_copy_7', 'images/1024_navi_Shape-3-copy-7.gif'); return true;"
                onmousedown="changeImages('id1024_navi_Shape_3_copy_7', 'images/1024_navi_Shape-3-copy-7-do.gif'); return true;"
                onmouseup="changeImages('id1024_navi_Shape_3_copy_7', 'images/1024_navi_Shape-3-copy-7-ov.gif'); return true;">
                <img name="id1024_navi_Shape_3_copy_7" src="images/1024_navi_Shape-3-copy-7.gif" width="207" height="70" border="0" alt=""></a></td>
        <td rowspan="9">
            <img src="images/1024_navi_04.gif" width="8" height="805" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="63" alt=""></td>
    </tr>
    <tr>
        <td rowspan="8">
            <img src="images/1024_navi_05.gif" width="7" height="742" alt=""></td>
        <td colspan="2" rowspan="3">
            <a href="javascript:void(0);" onclick="sndReq('getSeite2');"
                onmouseover="changeImages('id1024_navi_Shape_3_copy_5010', 'images/1024_navi_Shape-3-copy-5-ov.gif'); return true;"
                onmouseout="changeImages('id1024_navi_Shape_3_copy_5010', 'images/1024_navi_Shape-3-copy-5-10.gif'); return true;"
                onmousedown="changeImages('id1024_navi_Shape_3_copy_5010', 'images/1024_navi_Shape-3-copy-5-do.gif'); return true;"
                onmouseup="changeImages('id1024_navi_Shape_3_copy_5010', 'images/1024_navi_Shape-3-copy-5-ov.gif'); return true;">
                <img src="images/1024_navi_Shape-3-copy-5.gif" width="2" height="70" border="0" alt=""></a></td>
        <td>
            <img src="images/spacer.gif" width="1" height="7" alt=""></td>
    </tr>
    <tr>
        <td>
            <a href="javascript:void(0);" onclick="sndReq('getSeite2');"
                onmouseover="changeImages('id1024_navi_Shape_3_copy_5010', 'images/1024_navi_Shape-3-copy-5-ov.gif'); return true;"
                onmouseout="changeImages('id1024_navi_Shape_3_copy_5010', 'images/1024_navi_Shape-3-copy-5-10.gif'); return true;"
                onmousedown="changeImages('id1024_navi_Shape_3_copy_5010', 'images/1024_navi_Shape-3-copy-5-do.gif'); return true;"
                onmouseup="changeImages('id1024_navi_Shape_3_copy_5010', 'images/1024_navi_Shape-3-copy-5-ov.gif'); return true;">
                <img name="id1024_navi_Shape_3_copy_5010" src="images/1024_navi_Shape-3-copy-5-10.gif" width="205" height="54" border="0" alt=""></a></td>
        <td colspan="2">
            <img src="images/1024_navi_08.gif" width="2" height="54" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="54" alt=""></td>
    </tr>
    <tr>
        <td colspan="3" rowspan="2">
            <a href="javascript:void(0);" onclick="sndReq('getSeite3');"
                onmouseover="changeImages('id1024_navi_Shape_3_copy_4', 'images/1024_navi_Shape-3-copy-4-ov.gif'); return true;"
                onmouseout="changeImages('id1024_navi_Shape_3_copy_4', 'images/1024_navi_Shape-3-copy-4.gif'); return true;"
                onmousedown="changeImages('id1024_navi_Shape_3_copy_4', 'images/1024_navi_Shape-3-copy-4-do.gif'); return true;"
                onmouseup="changeImages('id1024_navi_Shape_3_copy_4', 'images/1024_navi_Shape-3-copy-4-ov.gif'); return true;">
                <img name="id1024_navi_Shape_3_copy_4" src="images/1024_navi_Shape-3-copy-4.gif" width="207" height="64" border="0" alt=""></a></td>
        <td>
            <img src="images/spacer.gif" width="1" height="9" alt=""></td>
    </tr>
    <tr>
        <td colspan="2" rowspan="2">
            <img src="images/1024_navi_10.gif" width="2" height="119" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="55" alt=""></td>
    </tr>
    <tr>
        <td colspan="3">
            <a href="javascript:void(0);" onclick="sndReq('getSeite4');"
                onmouseover="changeImages('id1024_navi_Shape_3_copy', 'images/1024_navi_Shape-3-copy-over.gif'); return true;"
                onmouseout="changeImages('id1024_navi_Shape_3_copy', 'images/1024_navi_Shape-3-copy.gif'); return true;"
                onmousedown="changeImages('id1024_navi_Shape_3_copy', 'images/1024_navi_Shape-3-copy-down.gif'); return true;"
                onmouseup="changeImages('id1024_navi_Shape_3_copy', 'images/1024_navi_Shape-3-copy-over.gif'); return true;">
                <img name="id1024_navi_Shape_3_copy" src="images/1024_navi_Shape-3-copy.gif" width="207" height="64" border="0" alt=""></a></td>
        <td>
            <img src="images/spacer.gif" width="1" height="64" alt=""></td>
    </tr>
    <tr>
        <td rowspan="3">
            <img src="images/1024_navi_12.gif" width="1" height="553" alt=""></td>
        <td colspan="3" rowspan="2">
            <a href="javascript:void(0);" onclick="sndReq('getSeite5');"
                onmouseover="changeImages('id1024_navi_Shape_3_copy_2', 'images/1024_navi_Shape-3-copy-2-ov.gif'); return true;"
                onmouseout="changeImages('id1024_navi_Shape_3_copy_2', 'images/1024_navi_Shape-3-copy-2.gif'); return true;"
                onmousedown="changeImages('id1024_navi_Shape_3_copy_2', 'images/1024_navi_Shape-3-copy-2-do.gif'); return true;"
                onmouseup="changeImages('id1024_navi_Shape_3_copy_2', 'images/1024_navi_Shape-3-copy-2-ov.gif'); return true;">
                <img name="id1024_navi_Shape_3_copy_2" src="images/1024_navi_Shape-3-copy-2.gif" width="207" height="70" border="0" alt=""></a></td>
        <td>
            <a href="javascript:void(0);" onclick="sndReq('getSeite4');"
                onmouseover="changeImages('id1024_navi_Shape_3_copy', 'images/1024_navi_Shape-3-copy-over.gif'); return true;"
                onmouseout="changeImages('id1024_navi_Shape_3_copy', 'images/1024_navi_Shape-3-copy.gif'); return true;"
                onmousedown="changeImages('id1024_navi_Shape_3_copy', 'images/1024_navi_Shape-3-copy-down.gif'); return true;"
                onmouseup="changeImages('id1024_navi_Shape_3_copy', 'images/1024_navi_Shape-3-copy-over.gif'); return true;">
                <img src="images/1024_navi_Shape-3-copy-25.gif" width="1" height="6" border="0" alt=""></a></td>
        <td>
            <img src="images/spacer.gif" width="1" height="6" alt=""></td>
    </tr>
    <tr>
        <td rowspan="2">
            <img src="images/1024_navi_15.gif" width="1" height="547" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="64" alt=""></td>
    </tr>
    <tr>
        <td colspan="3">
            <img src="images/1024_navi_16.gif" width="207" height="483" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="483" alt=""></td>
    </tr>
    <tr>
        <td>
            <img src="images/spacer.gif" width="7" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="205" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="8" height="1" alt=""></td>
        <td></td>
    </tr>
</table>
</body>
</html>
[/CODE]
 
Versuchs mal mit CSS und border-style:none

HTML:
<a href="www.google.de"><img style="border-style:none;" src="1.jpg"></a>

DaDrivel
 
Werbung:
also sofern ich es an der richtigen stelle eingesetzt habe funzt es auch nicht,
habs wi folgt gemacht

Code:
<a href="javascript:void(0);" onclick="sndReq('getSeite1'); img style="border-style:none;"
                onmouseover="changeImages('id1024_navi_Shape_3_copy_7', 'images/1024_navi_Shape-3-copy-7-ov.gif'); return true;"
                onmouseout="changeImages('id1024_navi_Shape_3_copy_7', 'images/1024_navi_Shape-3-copy-7.gif'); return true;"
                onmousedown="changeImages('id1024_navi_Shape_3_copy_7', 'images/1024_navi_Shape-3-copy-7-do.gif'); return true;"
                onmouseup="changeImages('id1024_navi_Shape_3_copy_7', 'images/1024_navi_Shape-3-copy-7-ov.gif'); return true;">
                <img name="id1024_navi_Shape_3_copy_7" src="images/1024_navi_Shape-3-copy-7.gif" width="207" height="70" border="0" alt=""></a></td>
        <td rowspan="9">
 
Versuchs mal mit CSS und border-style:none

HTML:
<a href="www.google.de"><img style="border-style:none;" src="1.jpg"></a>
DaDrivel

Mit CSS ist schonmal ne gute Idee, aber der Rahmen wird ja nicht vom Bild, sondern vom Link erzeugt (im Regelfall). Also:

HTML:
<a href="www.google.de" style="border-style:none;"><img src="1.jpg"></a>

So müsste es eigentlich gehen.
 
ne leider auch nicht, füge ich es denn an der richtigen stelle ein ? bin noch ganz neu was css und html angeht :)

Code:
<a href="javascript:void(0);" onclick="sndReq('getSeite4');" [COLOR=Red]style="border-style:none;[/COLOR]
                onmouseover="changeImages('id1024_navi_Shape_3_copy', 'images/1024_navi_Shape-3-copy-over.gif'); return true;"
                onmouseout="changeImages('id1024_navi_Shape_3_copy', 'images/1024_navi_Shape-3-copy.gif'); return true;"
                onmousedown="changeImages('id1024_navi_Shape_3_copy', 'images/1024_navi_Shape-3-copy-down.gif'); return true;"
                onmouseup="changeImages('id1024_navi_Shape_3_copy', 'images/1024_navi_Shape-3-copy-over.gif'); return true;">
                <img name="id1024_navi_Shape_3_copy" src="images/1024_navi_Shape-3-copy.gif" width="207" height="64" border="0" alt=""></a>

mir ist gerade aufgefallen das nur firefox das problem mach, im ie7 habe ich die rahmen nicht, vileicht hilft das ja jemandem

Mod-Edit: Doppelpost zusammengeführt - Es gibt eine Editierfunktion... (XraYSoLo)
 
Zuletzt bearbeitet von einem Moderator:
Werbung:
Probiers noch mal mit border: none; statt border-style: none;

und vergiss nicht die "" wieder zuzumachen.

EDIT: Die Stelle stimmt.
 
Also, in deinem Code fehlt im Moment noch ein schliessendes ' " ' bei dem Style.
Das "border-style:none" habe ich in das <img> reingschrieben, weil es in dem <a> keine Wirkung gezeigt hat (ich vermute mal, die Eigenschaft wird doch noch irgendwie ueberschrieben)

DaDrivel

EDIT: Meiner Meinung nach, solltest du es in das <img> tag reinschrieben, also so:
Code:
<a href="javascript:void(0);" onclick="sndReq('getSeite4');"
                onmouseover="changeImages('id1024_navi_Shape_3_copy', 'images/1024_navi_Shape-3-copy-over.gif'); return true;"
                onmouseout="changeImages('id1024_navi_Shape_3_copy', 'images/1024_navi_Shape-3-copy.gif'); return true;"
                onmousedown="changeImages('id1024_navi_Shape_3_copy', 'images/1024_navi_Shape-3-copy-down.gif'); return true;"
                onmouseup="changeImages('id1024_navi_Shape_3_copy', 'images/1024_navi_Shape-3-copy-over.gif'); return true;">
                <img [COLOR=Red]style="border-style:none;[/COLOR]" name="id1024_navi_Shape_3_copy" src="http://www.html.de/images/1024_navi_Shape-3-copy.gif" width="207" height="64" border="0" alt=""></a>
 
Zuletzt bearbeitet:
hilft leider alles nicht zum erfolg :( glaub ich werd einfach selber nen navi machen dan hab ich nicht das prob das ich den quelltext leber nicht verstehe ^^

EDIT: mir ist gerade aufgefallen das ich das auf sämtlichen webseiten habe hab ich vorher gar nicht drauf geachtet aber ist echt auf sämmtelichen seite so, ist mir halt nur bei meiner seite jetzt aufgefallen ^^
 
Zuletzt bearbeitet:
Werbung:
img { border:0 } ist schon richtig, man kann das natürlich ausweiten auf "a img { border:0 }.
Wenn das bei Dir nicht klappt, machst Du irgendwas anderes falsch. Und wenn auch die Tabellen in Deinem Code wohl zu Layoutzwecken missbraucht werden, da also völlig fehl am Platze sind, sind die sicher nicht der Grund, warum obiger CSS-Code bei Dir nicht funktionieren soll.

Nenn uns doch mal nen Link zur Seite und die Stelle, wo es nicht klappt.
 
Also ich weiss ja nicht wo da hier das Problem sein soll mit den Rändern. Hab es eben mal ausprobiert. und an die selbe stelle gesetzt wie es Toastbrot geschrieben hat. Bei mir ist der Linkrand entfernt und der Link funzt weiterhin :smile: einfach nochmal im quelltext schauen, kenne das auch das dann ab und zu mal das " fehlt :)

LG Ossi112
 
Zurück
Oben