HTML-elementit

Kurssivinkki:

HTML-elementit

HTML-dokumentti määritellään HTML-elementtien avulla.

HTML-elementtien syntaksi HTML-elementti tarkoittaa kaikkea koodia alkukilpailusta (start tag) loppukilpailuun (end tag). HTML-elementti alkaa
Elementin sisältö <p> Tämä on kappale
</p> <a href="default.htm" > Tämä on linkki
</a>

Huomautus:<br />

Aloituskilpailu kutsutaan yleensä avauskilpailuksi (opening tag), loppukilpailu yleensä sulkeutuvaksi kilpailuksi (closing tag).

  • AloitusHTML-elementtien syntaksiAloituskilpailu
  • AloitusHTML-elementti alkaaLoppukilpailu
  • PäättäminenElementin sisältö
  • On alkukilpailun ja loppukilpailun välinen sisältöTietyillä HTML-elementeillä on
  • Tyhjä sisältö (empty content)Tyhjä elementtiSulje alkukilpailussa
  • (lopettavat alkukilpailun lopussa)Useimmat HTML-elementit voivat omaa

OminaisuudetVinkki:

Sisäänrakennetut HTML-elementit

Useimmat HTML-elementit voivat olla sisäänrakennettuja (voivat sisältää muita HTML-elementtejä).

HTML-dokumentti koostuu sisäänrakennetuista HTML-elementeistä.

HTML-dokumentti esimerkki

<html>
<body>
<p>Tämä on ensimmäinen kappaleeni.</p>
</body>
</html>

Yllä oleva esimerkki sisältää kolme HTML-elementtiä.

HTML-esimerkki selitys

<p> -elementti:

<p>Tämä on ensimmäinen kappaleeni.</p>

Tämä <p> -elementti määrittelee HTML-dokumentissa olevan kappaleen.

Tämä elementti omaa alkukilpailun <p> ja loppukilpailun </p>.

Elementin sisältö on: Tämä on ensimmäinen kappaleeni.

<body> -elementti:

<body>
<p>Tämä on ensimmäinen kappaleeni.</p>
</body>

<body> -elementti määrittelee HTML-dokumentin pääosan.

Tämä elementti omaa alkukilpailun <body> ja loppukilpailun </body>.

Elementin sisältö on toinen HTML-elementti (p-elementti).

<html> -elementti:

<html>
<body>
<p>Tämä on ensimmäinen kappaleeni.</p>
</body>
</html>

<html>-elementti määrittää koko HTML-dokumentin.

Tämä elementti omaa aloitusmerkin <html> ja lopetusmerkin </html>.

Elementin sisältö on toinen HTML-elementti (body-elementti).

Älä unohda lopetusmerkkiä

Vaikka unohtaisit käyttää lopetusmerkkiä, useimmat selaimet näyttävät HTML:n oikein:

<p>Tämä on kappale
<p>Tämä on kappale

Yllä olevat esimerkit toimivat useimmissa selaimissa, mutta älä luota tähän käytäntöön. Lopetusmerkkien unohtaminen voi aiheuttaa odottamattomia tuloksia tai virheitä.

Huomautus:Tulevaisuuden HTML-versiot eivät salli lopetusmerkkien jättämistä pois.

Tyhjät HTML-elementit

Tyhjät HTML-elementit eivät sisällä sisältöä. Tyhjät elementit suljetaan alkuperäisessä aloitusmerkissä.

<br> on tyhjä elementti ilman sulkeetettua lopetusmerkkiä (br-merkki määrittää rivinvaihdon).

XHTML:ssä, XML:ssä ja tulevaisuuden HTML-versioissa kaikki elementit täytyy sulkea.

Lisää viivaosittainen slash alkuperäiseen merkkiin, kuten <br />, oikea tapa sulkea tyhjä elementti, HTML, XHTML ja XML hyväksyvät tämän tavan.

Vaikka <br> on kaikkiin selaimiin sopiva, <br /> on pidempiaikainen turva.

HTML-vinkki: Käytä pieniä kirjaimia elementtien nimissä

HTML-elementit eivät ole kirjaintunnuksille herkkiä: <P> on sama kuin <p>. Monet verkkosivut käyttävät isokirjaimisia HTML-elementtejä.

CodeW3C.com käyttää pieniä kirjaimia elementtien nimissä, koska W3C käyttää HTML 4:ssäSuositeltavaKäytä pieniä kirjaimia, ja tulevaisuuden (X)HTML-versioissaPakollinenKäytä pieniä kirjaimia.