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

Link-Formatierung

J

Johannes11

Neues Mitglied
Hallo. Ich habe ein Problem bei der Link-Formatierung. Bevor man die Punkte im Menü klickt, sind sie durchgestrichen, nach dem klicken bekommen sie mehr Laufweite. Allerdings sollen die Punkte dann nicht mehr durchgestrichen sein, was ich nicht hinbekomme. Ich habe das Menü hiermit formatiert

im code:
<li><a href="Arbeiten.html"span style="letter-spacing:0.6em";>Arbeiten</a></li>

in css:
#navi :link { text-decoration:line-through; }

ich bin noch Anfänger und weiss nicht ob dieses seperate formatieren die sinnvollste Lösung ist. Vielleicht kann mir jemand weiterhelfen. Vielen Dank

Johannes
 
Werbung:
also erstmal das style getrennt von deinem normalen html script ist die einzig wahre lösung =)

dann zu deinem code
das war nicht dein echter code oder?
gabs da noch n span oder so?
weil so ist er falsch
habs mal probiert besser zu machen

HTML: 
<li>
   <a href="arbeiten.html" id="navi">Arbeiten</a>
</li>
CSS
Code: 
#navi {
   letter-spacing: 0.6em;}
#navi :link {
   text-decoration:line-through;}
so ist das style jetzt ganz getrennt^^
da das ja aber großenteils schon so hattest muss mans denk ich nich erklären

probiers nochmal so aus und schau obs geht =)

gruß


ps öhm was für ne pseudoklasse als css willst du überhaupt?
also des mit dem ':' zB ':link'
pseudo klassen
des is was du brauchst

wenn was ned verstehst entweder googlen oder fragen^^

pps:
nächstes mal bitte code tag verwenden beim eintrag schreiben =) thx
 
Zuletzt bearbeitet:
Hi. Erstmal danke für die Antwort. Wenn ich es jetzt so in CSS eintrage, würde es dann doch auf alle Navi-Punkte ansprechen oder nicht? Wenn man es klickt, soll der Rest so bleiben und nur der aktivierte Button die Durchstreichung verlieren und Laufweite bekommen ... Wie gesagt ich bin Anfänger, deswegen weiss ich gerade auch nicht genau, was eine Pseudoklasse ist, bzw. wozu sie gut ist.

Gruß
 
Werbung:
vanGoss schrieb:
HTML: 
<li>
   <a href="arbeiten.html" id="navi">Arbeiten</a>
</li>
CSS
Code: 
[B]#[/B]navi {
   letter-spacing: 0.6em;}
#navi :link {
   text-decoration:line-through;}
Zum Vergrößern anklicken....

also ich hab da jetzt mal 2 sachen markiert(sieht man ned =()
wenn du css machstmusst du ja vor des '{' schreiben, was du ansprechen willst
des geht auf mehrere methoden:

  • einfach nur den tagname also zB a :
    Code: 
    a{color:red;}
  • dann kannst du eine bestimmte id machen, des war des was du gemacht hast :
    Code: 
    #navi{color:red;}
  • du kannst auch so genannte klassen erstellen, das geht so:
    Code: 
    .navi_klasse{color:red;}
es gibt auch noch andere möglichkeiten aber das sind die wichtigsten
ersteres ist für generelle deklarationen gut oder wenns nur ein element gibt zB <body>
die anderen sind imho eher gleichwertig aber man darf(!) auf einer seite jede id nur einmal verwenden, also müsstest du in deinem fall, wenn du mehrere links hast, eine komplizierter lösung machen ABER du kannst auch einfach die klassen nehmen
ich schreib dein bsp kurz mal um:
noch was vorher
eine pseudoklasse wird aktiv bei bestimmten aktionen oder erläutert einen klasse/css elemt näher
:hover zB wird aktiv wenn du mit der maus über den teil drüber fährst

HTML: 
<html>
<head>
<style type="text/css">
.navi {
   letter-spacing: 0.6em;}
.navi:link {
   text-decoration:line-through;}
</style>
</head>

<body>
<ul>
  <li>
    <a href="arbeiten.html" class="navi">Arbeiten</a>
  </li>
  <li>
    <a href="arbeiten.html" class="navi">Arbeiten</a>
  </li>
  <li>
    <a href="arbeiten.html" class="navi">Arbeiten</a>
  </li>
  <li>
    <a href="arbeiten.html" class="navi">Arbeiten</a>
  </li>
</ul>



</body>
</html>
hoffe das ist was du meinst
gruß

ps versuche erst mal immer deine seiten in html validator und css vaidator zu testen
der gibt dir mögliche fehler aus und hilft zu besserem html
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben