Avatar billede dotcom1 Nybegynder
05. juli 2006 - 10:31 Der er 6 kommentarer og
1 løsning

Link style

Hej.

Jeg sidder og roder med at give links i min <thead> en style, men kan ikke få det til at virke.

Har denne tabel:

<table class="list" align="left" border="0" cellpadding="2" cellspacing="0" width="572">
  <thead>
    <tr>
      <th width="60%" align="left"><a href="" onclick="return sortTable(0);">Titel</a></th>
      <th width="29%" align="left"><a href="" onclick="return sortTable(1);">Enhed</a></th>
      <th width="11%" align="left"><a href="" onclick="return sortTable(2);">Dato</a></th>
    </tr>
    </thead>
    <tbody id="job_set">
    <tr>
      <td class="list-item-light" width="60%"><a href="#" target="_blank" class="list"><!-- #echo job.list.titel --></a></td>
      <td class="list-item-light" width="29%"><!-- #echo job.list.departments --></td>
      <td class="list-item-light"><!-- #echo job.list.deadline --></td>
    </tr>
  </tbody>
</table>

Min css ser sådan ud:

table.list {
    background-color: #ffffff;
    border-collapse:collapse;
}

td.list-item-light {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    text-decoration: none;
    color: #333;
    background-color: #fff;   
}

a.list {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    text-decoration: underline;
    color: #17416c;
    background-color: #ffffff;
    -moz-outline-style: none;
}

a:active.list {
    font-size: 11px;
    text-decoration: underline;
    color: #999999;
    background-color: #ffffff;
    -moz-outline-style: none;
}

a:visited.list {
    font-size: 11px;
    text-decoration: underline;
    color: #999999;
    background-color: #ffffff;
    -moz-outline-style: none;
}

a:hover.list {
    font-size: 11px;
    text-decoration: none;
    color: #fff;
    background-color: #17416c;
    -moz-outline-style: none;
}

- Hvordan får jeg givet de tre onclick-links i <thead> deres egen linkstyle? Hvad skal jeg kalde klassen? Har prøvet med f.eks. a.list th {} men det virker ikke...
Avatar billede milandt Nybegynder
05. juli 2006 - 11:06 #1
alle regler i din css henviser til a.list

prøv at give de links du gerne vil ha skal bruge denne regel klassen "list"

<a href=".." class="list">...</a>








.. and wth is <thead>?
Avatar billede mm12010 Nybegynder
05. juli 2006 - 11:07 #2
du skal navigere oppefra og nedad i hierakiet:

table.list thead tr th a{}
Avatar billede dotcom1 Nybegynder
05. juli 2006 - 11:10 #3
thead = table head.

Klassen list bruges allerede i denne linie:
<td class="list-item-light" width="60%"><a href="#" target="_blank" class="list"><!-- #echo job.list.titel --></a></td>

- Og det virker fint. Det, jeg gerne vil vide er, hvordan jeg kan style de links, der ligger i <th>...
Avatar billede dotcom1 Nybegynder
05. juli 2006 - 11:12 #4
mm12010 >> Okay, men hvad skal jeg så kalde min class i css'en til dette link:
<th width="60%" align="left"><a href="" onclick="return sortTable(0);">Titel</a></th>
Avatar billede powerpunk Nybegynder
05. juli 2006 - 11:33 #5
Hvis du i stedet definerer dine styles således at du har

.list a {...}
.list a:active {...}
.list a:visited {...}
.list a:hover {...}

så opnår du at alle <A> tags under elementer med stylen .list får den definerede style...

Da du har defineret din hovedtabel som class="list", ville det slå igennem for alle dine links i denne tabel.

Alternativt kan du definere

thead a {...}

som så vil gælde for links under <thead> elementer i hele siden.
Skal det kun gælde for <thead> i class="list"-tabeller hedder det:

.list thead a {...}
Avatar billede dotcom1 Nybegynder
05. juli 2006 - 11:42 #6
Powerpunk >> Det var lige det, der skulle til. Det virker. Læg et svar.
Avatar billede powerpunk Nybegynder
06. juli 2006 - 09:37 #7
Det kommer så her :-)
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