Wat is HTML?
HTML staan vir H yper T ext M arkup T anguage
HTML is die standaard opmaaktaal vir webblaaie
HTML - elemente is die boustene van HTML-bladsye
HTML-elemente word deur <>-merkers voorgestel
HTML elemente
'n HTML-element is 'n beginmerker en 'n eindmerker met inhoud tussenin:
<h1>Dit is 'n Opskrif</h1>
Start tag | Element content | End tag |
---|---|---|
<h1> | This is a Heading | </h1> |
<p> | This is paragraph. | </p> |
HTML-kenmerke
- HTML-elemente kan eienskappe hê
- Eienskappe verskaf bykomende inligting oor die element
- Eienskappe kom in naam/waarde-pare soos charset="utf-8"
'n Eenvoudige HTML-dokument
<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">
<title>Page Title</title>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<p>This is
another paragraph.</p>
</body>
</html>
Voorbeeld Verduidelik
HTML-elemente is die boustene van HTML-bladsye.
- Die
<!DOCTYPE html>
verklaring definieer hierdie dokument as HTML5 - Die
<html>
element is die wortelelement van 'n HTML-bladsy - Die
lang
kenmerk definieer die taal van die dokument - Die
<meta>
element bevat meta-inligting oor die dokument - Die
charset
kenmerk definieer die karakterstel wat in die dokument gebruik word - Die
<title>
element spesifiseer 'n titel vir die dokument - Die
<body>
element bevat die sigbare bladsyinhoud - Die
<h1>
element definieer 'n groot opskrif - Die
<p>
element definieer 'n paragraaf
HTML-dokumente
Alle HTML-dokumente moet begin met 'n dokumenttipe verklaring: <!DOCTYPE html>
.
Die HTML-dokument self begin met <html>
en eindig met </html>
.
Die sigbare deel van die HTML-dokument is tussen <body>
en </body>
.
HTML-dokumentstruktuur
Hieronder is 'n visualisering van 'n HTML-dokument ('n HTML-bladsy):
Let wel: Slegs die inhoud binne die <liggaam>-afdeling (die wit area hierbo) word in 'n blaaier vertoon.
HTML-opskrifte
HTML-opskrifte word gedefinieer met <h1>
na <h6>
-merkers.
<h1>
definieer die belangrikste opskrif. <h6>
definieer die minste belangrike opskrif:
Voorbeeld
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
HTML paragrawe
HTML-paragrawe word gedefinieer met <p>
etikette:
Voorbeeld
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
HTML skakels
HTML-skakels word gedefinieer met <a>
etikette:
Voorbeeld
<a href="https://www.w3schools.com">This is a link</a>
Die skakel se bestemming word in die href
kenmerk gespesifiseer.
HTML beelde
HTML-beelde word met <img>
etikette gedefinieer.
Die bronlêer ( src
), alternatiewe teks ( alt
),
width
, en height
word as kenmerke verskaf:
Voorbeeld
<img src="img_w3schools.jpg" alt="W3Schools" style="width:120px;height:150px"
HTML-knoppies
HTML-knoppies word gedefinieer met <button>
etikette:
Voorbeeld
<button>Click me</button>
HTML-lyste
HTML-lyste word gedefinieer met <ul>
(ongeordende/kolpuntlys) of
<ol>
(geordende/genommerde lys) merkers, gevolg deur <li>
merkers (lysitems):
Voorbeeld
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
HTML-tabelle
'n HTML-tabel word met 'n <table>
merker gedefinieer.
Tabelrye word met <tr>
etikette gedefinieer.
Tabelopskrifte word met <th>
etikette gedefinieer. (by verstek vetgedruk en gesentreer).
Tabelselle (data) word met <td>
etikette gedefinieer.
Voorbeeld
<table>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
Programmering van HTML
Elke HTML-element kan eienskappe hê .
Vir webontwikkeling en -programmering is die belangrikste kenmerke id en klas. Hierdie eienskappe word dikwels gebruik om programgebaseerde webbladsymanipulasies aan te spreek.
Eienskap | Voorbeeld |
---|---|
id | <table id ="table01" |
klas | <p class ="normaal"> |
styl | <p style ="font-size:16px"> |
data- | <div data -id="500"> |
op klik | <input onclick ="myFunction()"> |
na die muis oor | <a onmouseover ="this.setAttribute('style','color:red')"> |
Volledige HTML-tutoriaal
Dit was 'n kort beskrywing van HTML.
Vir 'n volledige HTML-tutoriaal gaan na W3Schools HTML-tutoriaal .
Vir 'n volledige HTML-merkerverwysing gaan na W3Schools Tag Reference .