Avatar billede Slettet bruger
20. juni 2008 - 18:47 Der er 10 kommentarer og
1 løsning

Link style / CSS

Hej,

Hvordan laver jeg det i mit stylesheet så udvalgte hyperlinks for en speciel formatering? Eller endnu bedre hvis man kan sige at alle links i en celle skal have en speciel formatering?
Hvordan sættes det op i stylesheetet og kaldes i HTML koden?

<td class="linkformatering">
<a href="link.html">Link</a>
<a href="link.html">Link</a>

eller

<a href="link html" class="linkformatering">Link</a>

Hvordan laves det?
Avatar billede Slettet bruger
20. juni 2008 - 18:50 #1
td.linkformatering a {
  ....
}
Avatar billede olebole Juniormester
20. juni 2008 - 18:50 #2
<ole>

<style type="text/css">
.linkformatering a, .linkformatering a:visited {
    color: red;
    text-decoration: none;
}
.linkformatering a:hover {
    color: yellow;
    text-decoration: undeline;
}
</style>

- og:

<td class="linkformatering">
    <a href="link.html">Link</a>
    <a href="link.html">Link</a>

/mvh
</bole>
Avatar billede olebole Juniormester
20. juni 2008 - 18:52 #3
- evt:

.linkformatering a, .linkformatering a:visited {
    color: red;
    text-decoration: none;
}
.linkformatering a:hover {
    color: yellow;
    text-decoration: undeline;
}
.linkformatering a:active {
    color: blue;
    text-decoration: overline;
}

- eller, hvordan du nu synes de enkelte stadier skal se ud  =)
Avatar billede Slettet bruger
20. juni 2008 - 18:57 #4
Tak Ole, jeg bruger din kode da den er lige til at anvende og virker. Laver du et svar, så sender jeg points.
Avatar billede Slettet bruger
20. juni 2008 - 19:01 #5
Forresten, hvis jeg vil have mere luft imellem hvert link, kan jeg så sætte en ekstra parametre ind i mit css?
Avatar billede Slettet bruger
20. juni 2008 - 19:05 #6
Eller det laves måske ikke i CSS'en men i HTML'en hvis jeg ønsker mere luft imellem hver linie i den celle?
Avatar billede gadensgaard Nybegynder
20. juni 2008 - 19:12 #7
.linkformatering a vil vel være nok i første tilfælde?

altså
.linkformatering a {
    color: red;
    text-decoration: none;
    margin: 2px;
}
.linkformatering a:hover {
    color: yellow;
    text-decoration: undeline;
}
.linkformatering a:active {
    color: blue;
    text-decoration: overline;
}

for at lave mere plads kan du tilføje en margin til dine links:
Avatar billede Slettet bruger
20. juni 2008 - 19:56 #8
Jeg tænkte også lidt på at få en anden afstand imellem linierne overalt hvadend det er hyperlinks eller alm. tekst inde i celler... kan det lade sig gøre?
Hvis man bruger Margin laver den vil luft i alle retninger, top, bottom, left, right?
Avatar billede gadensgaard Nybegynder
20. juni 2008 - 20:37 #9
Du kan bruge line-height for at få mere luft imellem alle linier. Så skal den bare tilføjes CSS for body i stedet. Du kan aligne margin med margin-top, margin-bottom, margin-left og margin-right
Avatar billede olebole Juniormester
20. juni 2008 - 22:19 #10
Et link er et inline element, så der giver top- og bundmargin ikke mening. Sådan kan det derimod gøres:

.linkformatering a, .linkformatering a:visited {
    color: red;
    text-decoration: none;
    display: block;
    margin: 2px;
}
.linkformatering a:hover {
    color: yellow;
    text-decoration: underline;
}
.linkformatering a:active {
    color: blue;
    text-decoration: overline;
}

- og så ver der lige en sdavøfajl: 'undeline' -> 'underline'  ;o)
Avatar billede olebole Juniormester
20. juni 2008 - 23:39 #11
Tak for points  =)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester