Länkar
2008-03-19 @ 19:39:34
Det här med länkar gör ganska så mycket. Ni håller kanske med om att de länkarna som finns med i de färdiga stilmallarna ser förskräckliga ut. Nu ska ni få lära er hur man kan ändra färg och form på dem.
Länkarnas utseende bestämmer man i Stilmallen, vart de ska sitta bestämmer man i Kodmallen. Precis så är allt annat också uppbyggt.
Det finns länkar för de vanliga som man har i inläggen, de som är under inläggen (Kommentarer, Permalink osv), länkarna som är vid sidan under Arkiv och Kategori-rubrikerna och sen länkarna som kommentatorerna lägger ut på deras bloggadresser. Det är 4 stycken olika länkar med 4 olika platser i Stilmallen.
Såhär ser länkarna ut i Stilmallen:
Länkarna i allmänhet (effekt: länken är understruken)
a {color: #ff5db8;text-decoration:underline;}
a:hover {color: #333;text-decoration:underline;}
Länkarna i sidan (effekt: länken blinkar)
.nav a { color: #000000;text-decoration:blink;}
.nav a:hover { color: #ff5db8;text-decoration:blink;}
Länkarna under inläggen (effekt: länken blir större när man håller pilen på den)
.entrymeta a { color: #ff5db8; text-decoration:none;}
.entrymeta a:hover { color: #333;text-decoration:none; font-size:14 px}
Länkarna från kommentatorerna (effekt: länken är markerad med bakgrundfärg)
.commentmeta a { color: #FFFFFF; text-decoration:none; background-color: #666}
.commentmeta a:hover { color: #000000;text-decoration:none; background-color: #666 }
Ni ser ju att de ligger på två rader. Den första raden står för hur länken ser ut när man bara ser den. Den andra raden står för hur länken ser ut när man sätter pilen över den.
Det första ordet i koden står för placeringen, kika i mitt Stilmallslexikon om ni undrar vad olika ord betyder. Sen kommer färgkoden som ni säkert känner igen vid det här laget. Efter det står det text-decoration som betyder just dekoration. Länken kan vara understruken, blinkande och en massa andra effekter. Det står dekorationen för. Man kan som ni ser välja dekorationer för både innan och efter man håller pilen på den.
I länkkoderna ovan har jag satt ut olika slags text-dekorationer. Det är bara att pröva er fram tills ni hittar någon som faller er i smaken. Jag har ingen dekoration på mina, jag tycker det ser stilrenast ut. Men det är helt upp till er!
Länkar i Kodmallen(HTML) ser ut såhär
textlänk - <a href="länkadress" >text</a>
bildlänk - <a href="länkadress"><img src="bildadress" /></a>
De sätter man ut där man vill ha dem i kodmallen och där ändrar man endast vart länken ska gå och vad som ska vara en länk. Men det finns även sidor som inte har några stilmallar, då ska man även sätta in färg, textdekorationen och det i HTML. Men det tar vi någon annan gång om ni är intresserade! :)
Länkarnas utseende bestämmer man i Stilmallen, vart de ska sitta bestämmer man i Kodmallen. Precis så är allt annat också uppbyggt.
Det finns länkar för de vanliga som man har i inläggen, de som är under inläggen (Kommentarer, Permalink osv), länkarna som är vid sidan under Arkiv och Kategori-rubrikerna och sen länkarna som kommentatorerna lägger ut på deras bloggadresser. Det är 4 stycken olika länkar med 4 olika platser i Stilmallen.
Såhär ser länkarna ut i Stilmallen:
Länkarna i allmänhet (effekt: länken är understruken)
a {color: #ff5db8;text-decoration:underline;}
a:hover {color: #333;text-decoration:underline;}
Länkarna i sidan (effekt: länken blinkar)
.nav a { color: #000000;text-decoration:blink;}
.nav a:hover { color: #ff5db8;text-decoration:blink;}
Länkarna under inläggen (effekt: länken blir större när man håller pilen på den)
.entrymeta a { color: #ff5db8; text-decoration:none;}
.entrymeta a:hover { color: #333;text-decoration:none; font-size:14 px}
Länkarna från kommentatorerna (effekt: länken är markerad med bakgrundfärg)
.commentmeta a { color: #FFFFFF; text-decoration:none; background-color: #666}
.commentmeta a:hover { color: #000000;text-decoration:none; background-color: #666 }
Ni ser ju att de ligger på två rader. Den första raden står för hur länken ser ut när man bara ser den. Den andra raden står för hur länken ser ut när man sätter pilen över den.
Det första ordet i koden står för placeringen, kika i mitt Stilmallslexikon om ni undrar vad olika ord betyder. Sen kommer färgkoden som ni säkert känner igen vid det här laget. Efter det står det text-decoration som betyder just dekoration. Länken kan vara understruken, blinkande och en massa andra effekter. Det står dekorationen för. Man kan som ni ser välja dekorationer för både innan och efter man håller pilen på den.
I länkkoderna ovan har jag satt ut olika slags text-dekorationer. Det är bara att pröva er fram tills ni hittar någon som faller er i smaken. Jag har ingen dekoration på mina, jag tycker det ser stilrenast ut. Men det är helt upp till er!
Länkar i Kodmallen(HTML) ser ut såhär
textlänk - <a href="länkadress" >text</a>
bildlänk - <a href="länkadress"><img src="bildadress" /></a>
De sätter man ut där man vill ha dem i kodmallen och där ändrar man endast vart länken ska gå och vad som ska vara en länk. Men det finns även sidor som inte har några stilmallar, då ska man även sätta in färg, textdekorationen och det i HTML. Men det tar vi någon annan gång om ni är intresserade! :)
Kommentarer
Trackback