HTML 2. óra - Órai tananyag

Szent Angéla Általános Iskola és Gimnázium web-programozási szakkör.
3. órának a jegyzete - HTML 2
Készítette: Sztanka-Tóth Tamás, 2012 március

A <p> tag fontosabb attribútumai

Attrbútum neve Attribútum értékei, leírása Kód Megjelenés

align

left: balra
center: középre
right: jobbra
justify: sorkizárt

Leírás: A bekezdés igazítását állíthatjuk be.

<p align="center">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam at velit rhoncus quam porta eleifend nec et leo.</p>
<p align="left">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam at velit rhoncus quam porta eleifend nec et leo.</p>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam at velit rhoncus quam porta eleifend nec et leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam at velit rhoncus quam porta eleifend nec et leo.

Szöveg formázása a <font> tag segítségével

Attrbútum neve Attribútum értékei, leírása Kód Megjelenés

color

Leírás: Itt tudjuk megadni a szöveg színét, hexadecimális kóddal, vagy szöveggel

<font color="blue">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam at velit rhoncus quam porta eleifend nec et leo.</font><br />
<font color="#cc6699">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam at velit rhoncus quam porta eleifend nec et leo.</font>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam at velit rhoncus quam porta eleifend nec et leo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam at velit rhoncus quam porta eleifend nec et leo.

size

Leírás: Itt tudjuk beállítani a szöveg méretét

<font color="blue" size="4">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam at velit rhoncus quam porta eleifend nec et leo.</font><br />
<font color="#cc6699" size="2">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam at velit rhoncus quam porta eleifend nec et leo.</font>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam at velit rhoncus quam porta eleifend nec et leo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam at velit rhoncus quam porta eleifend nec et leo.
face Leírás: Itt tudjuk kiválasztani a betűtípust (alapértelmezetten "Times New Roman, Times, serif", 3-as méret) <font color="blue" size="4" face="Georgia, Times New Roman, Times, serif">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam at velit rhoncus quam porta eleifend nec et leo.</font><br />
<font color="#cc6699" size="2" face="Courier New, Courier, monospace">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam at velit rhoncus quam porta eleifend nec et leo.</font>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam at velit rhoncus quam porta eleifend nec et leo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam at velit rhoncus quam porta eleifend nec et leo.

További fontos szövegformázásra használt tag-ek

Kód: <b>félkövér betű</b>, <i>dőlt betű</i>, <u>aláhúzott betű</u>, vegyesen: <b>félkövér<i>és dőlt</i></b>
Megjelenítés: félkövér betű, dőlt betű, aláhúzott betű, vegyesen: félkövérés dőlt

A <table> tag legfontosabb attribútumai

Attrbútum neve Attribútum értékei, leírása Kód Megjelenés

align

left: balra
center: középre
right: jobbra

Leírás: A táblázat igazítását állíthatjuk be.

- -

bgcolor

Leírás: Itt be tudjuk állítani a táblázat hátterének a színét

- -

border

Leírás: Itt be tudjuk állítani a táblázat szegélyének a méretét ( pixelben )

- -

width

Leírás: Itt be tudjuk állítani a táblázat szélességét, pixelben vagy a képernyőhöz viszonyítva százalékosan

- -

cellpadding, cellspacing

Leírás: a cellák közti távolságot, és az egy cellán belüli szegélytől való távolságot adhatjuk meg itt ( pixelben )

cellpadding: a cella szegélye és a cella szövege közti távolságot adja meg
cellspacing: két cella közti távolságot adja meg

- -

A <td> tag legfontosabb attribútumai

Attrbútum neve Attribútum értékei, leírása Kód Megjelenés

align

left: balra
center: középre
right: jobbra
justify: sorkizárt

Leírás: Igazítja a cella tartalmát vízszintesen

- -

valign

top: fel
middle: középre
bottom: le

Leírás: Igazítja a cella tartalmát függőlegesen

- -

height

Leírás: megadja a cella magasságát

- -

width

Leírás: megadja a cella szélességét

- -

bgcolor

Leírás: Itt tudjuk beállítani a cella hátterének a színét

- -

A <body> tag legfontosabb attribútumai

Attrbútum neve Attribútum értékei, leírása Kód Megjelenés

background

Leírás: Itt be tudunk állítani egy képet az oldal hátterének

- -

bgcolor

Leírás: Itt tudod beállítani az oldal háttérszínét

- -

text

Leírás: Itt be tudod állítani egy oldal szövegének a színét

- -

link, alink, vlink

Leírás: Itt be tudod állítani a link színét különböző állapotban

link: a sima link színe
alink: a link színe ha fölé visszük az egeret
vlink: a meglátogatott link színe

- -

Órai feladat

A 2005-ös középszintű informatika érettségi 3. feladata.

A feladatot itt tudod megnézni: k_info_fl.pdf
A feladathoz tartozó forrás itt található: k_infoforras_fl.zip