HTML5 esittely

Jokaisen luvun HTML5-esimerkki

Esimerkki

<!DOCTYPE html>
<html>
<body>
<video width="420" controls>
  <source src="mov_bbb.mp4" type="video/mp4">
  <source src="mov_bbb.ogg" type="video/ogg">
 Selaimesi ei tue video-elementtiä.
</video>
</body>
</html>

Kokeile itse

Klikkaa "Kokeile itse" nähdäksesi, miten tämä esimerkki toimii.

Mitä on HTML5?

HTML5 on uusin HTML-standardi.

HTML5 on suunniteltu erityisesti rikkaiden web-内容的承载，ilman lisätyökaluja.

HTML5:llä on uusia semanttisia, graafisia ja multimediasovelluksia.

HTML5 tarjoaa uusia elementtejä ja uusia API:ta, jotka yksinkertaistavat web-sovellusten rakentamista.

HTML5 on monialustava ja on suunniteltu toimimaan eri tyyppisillä laitteilla (PC, tabletti, puhelin, television ym.).

Huomautus：Seuraavissa luvuissa opit, miten auttaa vanhoja selausohjelmia käsittelemään HTML5.

Mitä uutta HTML5:ssä on?

HTML5:n uusi dokumenttipyyntö (DOCTYPE) ilmoitus on erittäin yksinkertainen:

<!DOCTYPE html>
Uusi merkistökoodeauksen (charset) ilmoitus on myös erittäin yksinkertainen:
<meta charset="UTF-8">

HTML5-esimerkki：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Dokumentin otsikko</title>
</head>
<body>
Dokumentin sisältö......
</body>
</html>

Huomautus：HTML5:n oletuskoodaus on UTF-8.

HTML5 - uusi ominaisuuskieli

HTML5-standardi sallii neljä erilaista ominaisuuskieliä.

Tämä esimerkki näyttää eri syntaksien käytön <input>-elementissä:

Tyyppi Esimerkki
Tyhjä <input type="text" value="Bill Gates" disabled>
Ei lainausta <input type="text" value=Bill Gates>
Kaksinkertainen lainaus <input type="text" value="Bill Gates">
Yksinkertainen lainaus <input type="text" value='Bill Gates'>

HTML5-standardissa voidaan käyttää kahta grammaticaalista muotoa tarpeen mukaan.

HTML5 - Uudet ominaisuudet

HTML5:n kaikkein mielenkiintoisimmat uudet ominaisuudet:

  • Uusia semanttisia elementtejä, kuten <header>, <footer>, <article> ja <section>.
  • Uusia lomakkeiden valitsimia, kuten numeroita, päivämääriä, aikoja, kalentereita ja liukusäädimiä.
  • Voimakas kuvatuki (canvas- ja svg-elementtien avulla)
  • Voimakas multimediatuki (video- ja audio-elementtien avulla)
  • Voimakkaat uudet API:t, kuten paikallisen tallennuksen käyttö cookie:n sijaan.

HTML5 - Poistetut elementit

Seuraavat HTML 4.01-elementit on poistettu HTML5:stä:

  • <acronym>
  • <applet>
  • <basefont>
  • <big>
  • <center>
  • <dir>
  • <font>
  • <frame>
  • <frameset>
  • <noframes>
  • <strike>
  • <tt>