mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Fr 29.03.2024 09:24 Benutzername: Passwort: Auto-Login

Thema: HILFE! Links mit CSS definieren vom 05.03.2011


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> HILFE! Links mit CSS definieren
Autor Nachricht
Murchen
Threadersteller

Dabei seit: 05.03.2011
Ort: Hoitlingen
Alter: -
Geschlecht: Weiblich
Verfasst Sa 05.03.2011 00:48
Titel

HILFE! Links mit CSS definieren

Antworten mit Zitat Zum Seitenanfang

Hallo,

ich habe ein riesen Problem, das mich echt verzweifeln lässt. Ich versuche mich gerade an CSS, doch ist das für mich noch Neuland.

Ich habe eine Menüleiste mit CSS erstellt, die mir so wie sie ist auch gut gefällt. Dazu habe ich diplay:block verwendet.
Jetzt wirkt sich diese Definition aber auf alle Links aus, was natürlich nicht sein soll.
Bitte helft mir, ich dreh langsam durch, weil ich den Fehler nicht finde *Schnief*

Hier mal die Seite als Quelltext


Code:


<body text="#000000" bgcolor="#ffffff" link="#FFFFFF" alink="#FFFFFF" vlink="#FFFFFF">

<STYLE>BODY {
        FONT-SIZE: 8pt; COLOR: #000000; FONT-FAMILY: verdana;
}
TD {
        FONT-SIZE: 8pt; COLOR: #000000; FONT-FAMILY: verdana
}
A:link {
        COLOR: #000035; TEXT-DECORATION: none
}
A:visited {
        COLOR: #000035; TEXT-DECORATION: none
}
A:active {
        COLOR: #000035; TEXT-DECORATION: none
}
A:hover {
        COLOR: #B5B5B5; TEXT-DECORATION: none
}
INPUT {
        FONT-SIZE: 8pt; COLOR: rgb(99,99,99); FONT-FAMILY: verdana; BACKGROUND-COLOR: rgb(55,55,55)
}
TEXTAREA {
        FONT-SIZE: 8pt; COLOR: rgb(99,99,99); FONT-FAMILY: verdana; BACKGROUND-COLOR: rgb(44,44,44)
}
</STYLE>





 <style type="text/css">
   a      { display:block;
             width:101px; height:28px }
   #button1:hover { background-image:url(Design/home2.gif); }
   #button2:hover { background-image:url(Design/mich2.gif); }
   #button3:hover { background-image:url(Design/referenzen2.gif); }
   #button4:hover { background-image:url(Design/preise2.gif); }
   #button5:hover { background-image:url(Design/kontakt2.gif); }
   #button6:hover { background-image:url(Design/impressum2.gif); }
 </style>
</head>


<div align="center">



<table width="980" height="28" border="0" cellpadding="0" cellspacing="0">
 <tr>
 <td background="Design/header.gif"  width="980" height="162"  colspan="11"></td>
 </tr>
 <tr>
  <td background="Design/home.gif" width="101" height="28" ><a id="button1" href="index.html"></a></td>
  <td background="Design/mich.gif" width="101" height="28" ><a id="button2" href="mich.html"></a></td>
  <td background="Design/menuleiste1.gif" width="54" height="28" ></td>
  <td background="Design/referenzen2.gif" width="101" height="28" ><a id="button3" href="referenzen.html"></a></td>
  <td background="Design/menuleiste2.gif" width="38" height="28" ></td>
  <td background="Design/preise.gif" width="101" height="28" ><a id="button4" href="preise.html"></a></td>
  <td background="Design/menuleiste3.gif" width="197" height="28" ></a></td>
  <td background="Design/kontakt.gif" width="101" height="28" ><a id="button5" href="kontakt.html"></a></td>
  <td background="Design/menuleiste4.gif" width="28" height="28" ></td>
  <td background="Design/impressum.gif" width="101" height="28" ><a id="button6" href="impressum.html"></a></td>
  <td background="Design/menuleiste5.gif" width="57" height="28" ></td>
 </tr>
  <tr>
 <td background="Design/header2.gif"  width="980" height="27"  colspan="11"></td>
 </tr>
  <tr>
 <td background="Design/start2.gif"  width="980" height="467"  colspan="11">



  <table width="980">
   <tr>
    <td width="200">
    <div align="left">
        &nbsp;<font face="MONOSPACE"><font size="+1">Tierfotografie</font></font><br>
        &nbsp;<img src="Design/pfeil_ecke.gif" alt="" border="0" width="19" height="9">Pferde <br>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img src="Design/pfeil_ecke.gif" alt="" border="0" width="19" height="9">Detailbilder <br>
        &nbsp;<img src="Design/pfeil_ecke.gif" alt="" border="0" width="19" height="9"><a href="hunde.html" class="Link">Hunde</a><br>
        &nbsp;<img src="Design/pfeil_ecke.gif" alt="" border="0" width="19" height="9">Wildtiere    <p>


        &nbsp;<font face="MONOSPACE"><font size="+1">Kunstdrucke</font></font><br>
        &nbsp;<img src="Design/pfeil_ecke.gif" alt="" border="0" width="19" height="9">Tiere <br>
        &nbsp;<img src="Design/pfeil_ecke.gif" alt="" border="0" width="19" height="9">Stillleben<p>

        &nbsp;<p>&nbsp;<p>&nbsp;<p>&nbsp;<p>&nbsp;<p>&nbsp;<p>
    </div>
    </td>

    <td width="200"></td>
   </tr>
  </table>
 &nbsp;<p>&nbsp;





 </td>
 </tr>
   <tr>
 <td background="Design/down.gif"  width="980" height="115"  colspan="11"></td>
 </tr>
</table>












</div>

</html>
  View user's profile Private Nachricht senden
Nimroy
Community Manager

Dabei seit: 26.05.2004
Ort: zwischen Köln und D'dorf
Alter: 45
Geschlecht: Männlich
Verfasst Sa 05.03.2011 09:07
Titel

Antworten mit Zitat Zum Seitenanfang

hm, es ist noch früh und ich lieg noch im Bett, voon daher hab ich nur mal quer gelesen.

als erstes sind mir die tabellen aufgefallen. das ist murks! Css befreit dich ja von dieser krücke, mit tabellen layouten zu müssen. Menüs baut man in der Regel als Liste auf. Und dann lager mal die stylesheets aus in eine separate datei, inline formatierungen machen nur deine struktur unübersichtlich.

Das sich deine formatierungen für das Menü auf alle Links auswirken, deutet darauf hin, dass du keine Kaskadierung vorgenommen hast. du meinst ja nur die Links, die sich in deinem Menü befinden. Also muss du das auch so ins css schreiben.

Am besten guckst du dir mal css4you.de an, da sind die basics ganz gut erklärt. Und die scheinst du noch nötig zu haben.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
bambam42

Dabei seit: 10.04.2007
Ort: Dessau
Alter: 59
Geschlecht: Weiblich
Verfasst Sa 05.03.2011 09:17
Titel

Antworten mit Zitat Zum Seitenanfang

ich leg mal noch einen nach:
hier fehlen auch die HTML-Grundlagen, sprich, es hapert schon beim Grundgerüst der Datei

von daher neben css4you, bzw besser noch davor selfhtml durchackern
  View user's profile Private Nachricht senden
 
Ähnliche Themen Zweimal CSS Links definieren
CSS: links in klassen definieren -pseudoklassen in klassen?
pop up´s definieren?
Imagemaps definieren
[CSS] a zustände definieren
Hintergrund.Definieren?
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.