HTML alapok
Az HTML (HyperText Markup Language) egy olyan nyelv, amelyet a weboldalak létrehozására és formázására használnak. Az HTML kódok segítségével strukturált tartalmat hozhatunk létre, amelyet a böngészők megjelenítenek.
HTML elemek
Az HTML dokumentumok elemekből épülnek fel. Az elemeket nyitó és záró címkék közé helyezzük, és a tartalmat közöttük helyezzük el. Például:
<p>Ez egy bekezdés.</p>
A fenti példa egy <p>
elemet tartalmaz, amely egy bekezdést jelöl. Az elemeknek lehetnek attribútumaik is, amelyek további információkat adnak az elemről. Az attribútumokat az elem nyitó címkéjében adhatjuk meg. Például:
<a href="https://www.pelda.hu">Ez egy link</a>
A fenti példa egy <a>
elemet tartalmaz, amely egy hivatkozást jelöl. Az href
attribútum megadja a link címét.
HTML struktúra
Az HTML dokumentumoknak általában van egy fejléce és egy tartalma. A fejléc a <head>
elemen belül található, és metaadatokat, stíluslapokat és scripteket tartalmazhat. A tartalom a <body>
elemen belül található, és magát az oldal tartalmát jelenti.
<!DOCTYPE html>
<html>
<head>
<title>Példa oldal</title>
</head>
<body>
<h1>Üdvözöllek!</h1>
<p>Ez egy példa oldal.</p>
</body>
</html>
A fenti példa egy egyszerű HTML dokumentumot mutat be. A <!DOCTYPE html>
deklaráció megadja a böngészőnek, hogy az oldal HTML5 szabvány szerint készült. A <title>
elem a böngésző ablakában megjelenő címet adja meg.
HTML formázás
Az HTML lehetőséget nyújt a tartalom formázására is. Ehhez használhatunk stíluslapokat vagy inline stílusokat. A stíluslapokat a <style>
elemen belül definiálhatjuk, és az elemekre vonatkozóan alkalmazhatjuk őket. Például:
<style>
h1 {
color: blue;
}
</style>
A fenti példa a <h1>
elem szövegének kék színt ad.
Az inline stílusokat pedig közvetlenül az elem nyitó címkéjében adhatjuk meg. Például:
<p style="font-size: 20px;">Ez egy 20px-es betűméretű bekezdés.</p>
A fenti példa a <p>
elem szövegének 20px-es betűméretet ad.
Az HTML további lehetőségeket kínál a tartalom formázására, például táblázatok, listák, képek és videók beillesztése. Az alapok elsajátítása után további funkciókat és lehetőségeket is felfedezhetsz az HTML világában.