Luokittelu ominaisuudet (Classification properties)

Display
Whitespace
List Style Type
List Style Image
List Style Position
List Style

Display

Rakenne:	`display :` arvo
Mahdolliset arvot:	block \| inline \| list-item \| none
Oletusarvo:	block
Tukee:	Kaikki elementit
Periytyvyys:	Ei

display ominaisuudella kuvataan elementtiä yhdellä seuraavista neljästä arvosta:

block (Rivinvaihto ennen ja jälkeen elementin)
inline (Rivin sisäinen elementti, ei rivinvaihtoja edellä ja jäljessä)
list-item (Sama kuin block, mutta lista-merkki on lisätty)
none (Elementti ei näy)

Jokainen elementti saa yleensä display arvon selaimelta, perustuen HTML-määrityksen elementtien suositeltaviin esitystapoihin.

display ominaisuus voi olla vaarallinen käyttää johtuen sen kyvystä esittää elementtejä jotka muuten olisivat virheellisesti muotoiltuja. Arvo none laittaa sen elementin jolle se on määritelty esittämisen pois päältä, sisältäen myös sisemmät elementit.

alkuun

Whitespace

Rakenne:	`whitespace :` arvo
Mahdolliset arvot:	normal \| pre \| nowrap
Oletusarvo:	normal
Tukee:	block-elementit
Periytyvyys:	Kyllä

whitespace ominaisuus määrää kuinka elementin sisältämän tekstin välilyöntejä käsitellään. Tällä ominaisuudella voi olla kolme arvoa:

normal (Yhdistää useat peräkkäiset välilyönnit yhdeksi välilyönniksi)
pre (Ei yhdistä useampia välilyöntejä)
nowrap (Estää rivinvaihdon ilman BR-elementtiä)

alkuun

List Style Type

Rakenne: list-style-type : arvo

Mahdolliset arvot:

disc
circle
square
decimal

lower-roman
upper-roman
lower-alpha
upper-alpha

none

Oletusarvo: disc

Tukee: Elementit joiden display arvo on list-item

Perityvyys: Kyllä

list-style-type ominaisuus määrää listan luettelomerkin ja käytetään jos list-style-image-ominaisuudelle on laitettu arvo: none tai jos kuvien lataus ei ole päällä selaimessa.

Esimerkkejä:


LI.square { list-style-type : square }
UL.plain { list-style-type : none }
OL { list-style-type : lower-roman }  /* i ii iii iv v jne. */
OL OL { list-style-type : upper-alpha }  /* A B C jne. */
OL OL OL { list-style-type : decimal }  /* 1 2 3 jne. */

alkuun

List Style Image

Rakenne:	`list-style-image :` arvo
Mahdolliset arvot:	url \| none
Oletusarvo:	none
Tukee:	Elementit joiden display arvo on list-item
Periytyvyys:	Kyllä

list-style-image ominaisuudella määritetään kuva jota käytetään listan luettelomerkkinä jos kuvien lataus on päällä ja joka korvaa list-style-type ominaisuudella määritetyn luettelomerkin.

Esimerkkejä:


UL.check { list-style-image : url(LI-markers/checkmark.gif) }
UL LI.x { list-style-image : url(x.png) }

alkuun

List Style Position

Rakenne:	`list-style-position :` arvo
Mahdolliset arvot:	inside \| outside
Oletusarvo:	outside
Tukee:	Elementit joiden display arvo on list-item
Periytyvyys:	Kyllä

list-style-position hyväksyy arvon inside tai outside , joista outside on oletusarvo. Tämä ominaisuus määrää mihin luettelomerkki sijoittuu suhteessa tekstiin. Jos inside arvoa käytetään tekstirivit kiertävät luettelomerkin alle sen sijaan että ne olisivat sisennettyjä. Seuraavassa esimerkkejä:


LI { list-style-position : outside }
  * Eka rivi
    Toinen rivi
LI.inside { list-style-position : inside }
  * Eka rivi
  Toinen rivi

alkuun

List Style

Rakenne:	`list-style :` arvo
Mahdolliset arvot:	`list-style-type` \|\| `list-style-position` \|\| url
Oletusarvo:	Ei määritetty
Tukee:	Elementit joiden display arvo on list-item
Periytyvyys	Kyllä

list-style ominaisuus on oikotie list-style-type , list-style-position ja list-style-image ominaisuuksiin.

Esimerkkejä:


LI.square { list-style : square inside }
UL.plain { list-style : none }
UL.check { list-style : url(LI-markers/checkmark.gif) circle }
OL { list-style : upper-alpha }
OL OL { list-style : lower-roman inside }

alkuun