Selektorer: ID

Inledning
Taggar
Klasser
Grupperade selektorer
Sammanhangsstyrda

Det enskilda elementet får ett ID

Genom att ge ett enskilt element ett unikt ID, kan du koppla en stil just till det elementet utan att påverka andra element av samma slag. Här har jag gjort två tabeller med unika ID.

<DIV ID="lager1"> <TABLE bgcolor="#CCFF33"><tr><td>Lager 1<br>på 300,70</td></tr></TABLE > </DIV > <DIV ID="lager2"> <TABLE bgcolor="#CCFF33"><tr><td>Lager 2<br>på 320,90</td></tr></TABLE > </DIV >

Men för att deras ID skall få en mening, lägger jag dessutom definitionen av dem i en stilmall.

<STYLE type="text/css"> #lager1 {border: 0; width: 80; position: absolute; left: 300;top: 70; z-Index: 1} #lager2 {border: 0; width: 80; position: absolute; left: 320;top: 90; z-Index: 0} </STYLE>

Om sidan hade varit till uteslutande för att visas i Internet Explorer, hade jag kunnat flytta även färgvärdet för tabellernas bakgrund till stilmallen. Men det fungerar inte i Netscape, där tabellerna visserligen visas på rätt plats men utan färg.

I stilmallen kan du placera definitionerna i vilken ordning du vill. På sidan kommer den tabell som har högst index att placeras överst. ID-selektorer används främst tillsammans med lager.

Eftersom jag har angett "position: absolute" i definitionerna för de båda ID-selektorerna, kan jag placera koden var som helst på sidan. Tabellerna kommer ändå att visas på den plats som jag har bestämt.

Syntax för ID-selektorer

#ID-selektor {egenskap: värde;}

I stället för ID-selektor skriver du det ID som du ger den tillhörande taggen. Detta ID skall börja med en bokstav (A-Z) och bör inte innehålla någon punkt.

Inledning
Taggar
Klasser
Grupperade selektorer
Sammanhangsstyrda