[Alku]
Testaa CSS-oppaan navigoinnin toimivuutta!
 
 Etsi sivuiltani: [Apua]

Lohko- ja rivinsisäiselementit

Sen lisäksi, että elementit on luokittelu normaaleihin ja tyhjiin elementteihin, HTML:ssä on olemassa myös toinen perusluokittelu: lohkoelementit (tarkemmin sanottuna lohkotason elementit, block level elements) ja rivinsisäiselementit (tarkemmin sanottna rivinsisäistason elementit, inline level elements). Lohkoelementin kohdalla selain luo elementin ympärille ikään kuin näkymättömän suorakaiteen muotoisen laatikon (box) eli lohkon. CSS1 spesifikaatioissa sanotaan lohkoelementeistä, että niitä ennen ja niiden jälkeen on rivikatko.

Lohkoelementit voidaan luokitella joihinkin alaluokkiin. Yleisiä lohkoelementtejä ovat H1-H6, P, BLOCKQUOTE, OL, UL ja TABLE. Lohkoelementit voivat yleensä sisältää toisia lohkoelementtejä (eräitä rajoituksia on kuitenkin olemassa, joihin en tässä puutu) ja rivinsisäiselementtejä. Tämäkin teksti on lohkoelementin sisällä. Lohkoelementit toimivat ensisijaisesti asiasisällön jäsentely-, ryhmittely- ja rakenne-elementteinä (structural elements).

Rivinsisäiselementtejä on kahdentyyppisiä. Ensinnäkin erilaiset tekstiin liittyvät rivinsisäiselementit, esim. B ja I, joita voidaan pitää esitysasullisina elementteinä (inline presentational). Useimmilla tämän ryhmän elementeillä on tietty semanttinen (semantic = merkitysopillinen) sisältö. Em. elementit voidaan ilmaista myös semanttista puolta kuvaavilla elementeillä EM (emphasized = painotteinen) ja STRONG. Näitä elementtejä voisi kutsua rivinsisäisiksi fraasielementeiksi (inline phrasal). Tällaiset rivinsisäiselementit voivat olla rajoituksetta keskenään sisäkkäisiä (nested).

W3C: Modularization of XHTML (käytetyt termit).

Ne eivät luo ympärilleen lohkoelementtien tavoin suorakaiteen muotoisia laatikoita vaan elementit liikkuvat rivin mukana. Ne käyttäytyvät kuin rivillä oleva fraasi. Tekstiin vaikuttavia rivinsisäiselementtejä käytetään ensisijaisesti korostamaan jotain asiasisällön kohtaa.

Opiskeluaikana monet pistivät kirjoihinsa keltaisella paksulla tussilla merkkauksia. Käytän samaan tapaan elementtiä CODE, jonka avulla merkitsen sinisellä vain lähdekoodissa näkyvät merkintäkoodit - huomaa, että tässä lauseessa olevat korosteiset sanat ovat rivinsisäiselementtejä (CODE ja STRONG).

Kuva elementtimerkkauksesta

Myös linkitykseen käytetty erityiselementti A (sanasta Anchor = ankkuri) kuuluu rivinsisäiselementteihin. Se käyttäytyy tekstiin vaikuttavien elementtien tavoin, mutta sen rajoituksena on se, että linkitykseen käytetyt elementit eivät saa olla sisäkkäisiä.

Toiseksi on olemassa rivinsisäiselementtejä, jotka luovat ympärilleen yhtenäisen laatikon, mutta jotka kuitenkin liikkuvat rivin mukana toisin kuin lohkoelementit. Näitä elementtejä voisi käyttäytymisen perusteella nimittää rivinsisäislohkoelementeiksi (inline block elements). Eräät tyhjät elementit ovat luonteeltaan rivinsisäiselementtejä ja ne käyttäytyvät juuri tällä tavoin (kuten IMG = kuva).

Yleisesti ottaen rivinsisäiselementtejä tulisi yleensä käyttää vain lohkoelementtien sisällä. Tosin jotkin HTML-versiot sallivat niiden käyttämisen yksinäänkin, mutta niiden käyttö tällä tavoin ei ole suositeltavaa.

Lohko- ja rivinsisäiselementit tulisi sijoittaa toisiinsa nähden oikein. Elementtien väärinkäyttö on yleistä. Vaikka selaimet hyväksyvät jonkin verran elementtien väärää sijoittelua, se voi kuitenkin aiheuttaa ennalta odottamatonta virhekäyttäytymistä ja jopa kaataa selaimen. Voit opetella lohko- ja rivinsisäiselementtien oikeaa käyttöä englanninkielisistä eri spesifikaatioita käsittelevistä nooteista[S] ja taulukoista[S]. Myös tälle sivustolle määrittelemäni semantiikka[S] opettaa jonkin verran elementtien oikeaa käyttöä.

[Alku]