Muita komentoja

Listaan alle vielä muutamia harvemmin käytettäviä komentoja, joita kaikki selaimet eivät vielä välttämättä tue:

<abbr>

Lyhenne (abbreviation) komennon avulla voidaan selittää tekstissä käytetyn lyhenteen merkitys kun käyttäjä vie hiiren kursorin lyhenteen päälle. Komento voisi olla esim. muotoa.

<p>Meillä <abbr title="Validia-Ammattiopisto">VAO:ssa</abbr> on kunnia-asia.... </p>

Ruudulla teksti näkyisi seuraavasti:

Meillä VAO:ssa on kunnia-asia....

<audio>

On äänitiedostojen liittämistä varten. Komento voisi olla esim.

<audio controls>
<source src="elvis.mp3" type="audio/mpeg">
Valitettavasti selaimesi ei tue Audio elementtiä
</audio>

Ruudulla komento näyttäisi seuraavalta:

Komennolle voidaan antaa myös lisämääreitä, esim. autoplay, jolloin toisto alkaa automaattisesti tiedoston latauduttua (taustamusiikki) ja loop, jolloin se alkaa aina uudestaan alusta kappaleen loputtua. Mahdollisia tiedostomuotoja ovat mp3 (type="audio/mpeg"), ogg (type="audio/ogg") ja wav (type="audio/wav"). Paras selaintuki on mp3:lla joten sitä kannattaa enimmäkseen käyttää.

<br>

Pakollinen rivinvaihto (vastaa Wordin vaihto+enter painallusta). Ei tee siis kappalevaihtoa.

<button>

Painike, johon yleensä liitetään joku javascript toiminto. Esim.

<button type="button" onclick="alert('Painoit painiketta')">Paina</button>

Ruudulla painike näyttäisi seuraavalta:

Painikkeen ulkoasu muotoillaan usein CSS:n avulla.

<details>

Luo avattavan alueen. Alla esimerkki koodista (toimii kirjoitushetkellä vain Cromessa):

<p>Tässä tavallista tekstiä</p>
<details>
<summary>Web-koodauksen peruskurssi 25.8 - 30.11.2016</summary>
<p>HTML -perusteet<br>
CSS:n käyttö sivujen suunnittelussa<br>
Javascript perusteet<br>
Ilmoittautuminen 15.8. mennessä puh. 09 2920 2222 </p>
</details>
<p>Tässä jatkuu taas tavallinen teksti</p>

Ruudulla yllä oleva koodi tuottaisi seuraavan näkymän. Napauttamalla kolmiota avautuu piilossa ollut osa

Tässä tavallista tekstiä

Web-koodauksen peruskurssi 25.8 - 30.11.2016

HTML -perusteet
CSS:n käyttö sivujen suunnittelussa
Javascript perusteet
Ilmoittautuminen 15.8. mennessä puh. 09 2920 2222

Tässä jatkuu taas tavallinen teksti

<hr>

Piirtää vaakaviivan sivulle. Alla komento <hr>

Määreitä kuten width ja size ei enää tueta HTML5 määrityksessä. Eli mahdolliset muotoilut CSS tyylien kautta. Alla 5 pikselin punainen viiva (<hr style = "border-color:red; border-width:5px;">).

<iframe>

Upottaa toisen sivun nykyisen sivun sisään. Käytetään esim. Youtube -videoiden upottamiseen omalle sivulle (valmiin koodin saa Youtube sivustosta napauttamalla hiiren kakkospainiketta toistettavan videon päällä). Alla upotettu Validia-Ammattiopiston sivu osaksi tätä sivua (koossa 500 x 100 pikseliä).

<iframe src="http://www.validia-ammattiopisto.fi" width="500 px" height="100 px">

<object>

Käytetään erilaisten objektien upottamiseen html-sivulle. Esim. Flash animaatioiden upotukseen. Alla oleva koodi upottaa sivulle oheisen Flash animaation:

<object width="142px" height="350px" data="Banneri.swf" align="right"></object>

<video>

Kuten <audio>, mutta videotiedostojen liittämiseen. Komento voisi olla esim. muotoa:

<video width="640" height="480" controls>
<source src="elokuvan_nimi.mp4" type="video/mp4">
Selaimesi ei tue video komentoa.
</video>

Mahdolliset tiedostomuodot ovat MP4, WebM ja Ogg. Paras tuki on MP4 -formaatille.

HTML5 kielessä on vielä monia komentoja, joita en käsittele tässä yhteydessä. Kattava lista komennoista löytyy esim. täältä.