HTML Õppeveeb

MIS ON HTML?

HTML (HyperText Markup Language) on standardne märgistuskeel, mida kasutatakse veebilehtede loomisel. See võimaldab arendajatel struktureerida sisu ja lisada elemente, nagu pealkirjad, lõigud, pildid ja lingid.

HTML Põhitõed

HTML loob veebilehe struktuuri
Pealkirjad on <h1>–<h6>
Lõigud on <p> elemendis
Lingid luuakse <a> abil
Pildid lisatakse <img> elemendiga
Loendid: <ul> ja <ol>
Vormid kasutavad <form>, <input>, <button>
HTML loob veebilehe struktuuri
Pealkirjad on <h1>–<h6>
Lõigud on <p> elemendis
Lingid luuakse <a> abil
Pildid lisatakse <img> elemendiga
Loendid: <ul> ja <ol>
Vormid kasutavad <form>, <input>, <button>

HTML Näited


<!DOCTYPE html>
<html lang="et">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>>Minu esimene veebileht</title>
</head>
<body>
    <h1>Tere tulemast!</h1>
    <p>See on minu esimene veebileht.</p>
</body>
</html>

Struktuur: HTML5 dokument koos head ja body osaga


<h1>Suurem pealkiri</h1>
<h2>Veidi väiksem pealkiri</h2>
<p>See on lõik teksti.</p>

Pealkirjad h1–h6 ja lõigud p elementidega


<a href="https://www.google.com" target="_blank">Mine Google’i</a>

Lingid a elementidega, target="_blank" avab uues vahekaardis


<img src="pilt.jpg" alt="Kirjeldus pildist" width="300">

Pildi lisamine img elemendiga


<ol>
    <li>Esimene punkt</li>
    <li>Teine punkt</li>
</ol>

<ul>
    <li>Esimene punkt</li>
    <li>Teine punkt</li>
</ul>

Järjestatud ja järjendamata nimekirjad


<button>Vajuta mind</button>
<form action="/submit" method="post">
    <label for="name">Nimi:</label>
    <input type="text" id="name" name="name" placeholder="Sisesta oma nimi">
    <input type="submit" value="Saada">
</form>

Vormid input ja button elementidega

Võta ühendust