DTD és egy kis CSS...

A mai napon megtudjuk, hogy mi az a DTD és egy kicsit a CSS-szel is megismerkedünk.

Hibák...

Fontosnak tartottam egy olyan bejegyzést, melyben a hibatípusokat vesszük át.
Szóval.
2 fajta hibáról beszélhetünk HTML, CSS (és más "programnyelvek") írása során.

• szintaktikai hibák - ebben az esetben a weboldal kódja (vagy a program) nem felel meg a nyelv előírásainak.
• szemantikai hiba - ebben az esetben a kód helyes, azonban eredményül nem azt kapjuk, amit szeretnénk.

Elrendezések

Ma egy nagyon érdekes és hasznos dologgal ismerkedünk meg. Ha az oldalunkat szeretnénk "dizájnolni", akkor a jelenlegi tudásunkkal <table> táblázattal készítenénk el. Az első gyakorló feladat is valami ilyesmi volt. Nézzünk is meg egy képet:

Űrlapok || formok...

Elérkeztünk a gyakorlás végéhez. Újra belevágunk az "elméletbe". Mivel már rengeteget foglalkoztunk a HTML-lel, nem fogom annyira elmagyarázni a kódokat, hiszen már magatoktól is rá tudtok jönni. Persze ha valami nem érthető, akkor írjatok egy hozzászólást. A W3-as kezdő szintből kimaradtak a formok, vagy űrlapok. Ezzel fogunk ma foglalkozni.

• Mikor használjuk? - Ha az olvasónak valamilyen módon lehetőséget szeretnénk adni visszajelzésre, adatok megadására.

A <form> definiál egy űrlapot. Leggyakoribb eleme az <input>, ennek a tag-nek a type attribútumának értéke adja meg a beviteli módot. Ezekből fogunk néhányat megnézni:

"text" - Ezzel az értékkel szövegmezőt adhatunk meg. Lényege, hogy segítségével számokat, betűket lehet begépelni.

PÉLDA:

<form>

       Vezetéknév:

       <input type="text" name="vezeteknev">

       <br>

       Keresztnév:

       <input type="text" name="keresztnev">

</form>

Eredmény

Az utolsó feladat

Elérkeztünk az utolsó feladathoz. Itt megtalálhatjátok. Már megint a hármas a miénk.A szükséges fájlok és a kész oldal innen letölthetők.
Álljunk is neki!

Az ötödik feladat...

És itt a mai feladatunk is. Ismét a hármas a miénk. Itt 2 oldalt kell létrehozni. Először csak az egyiket, utána a másikat nézzük meg. A szükséges fájlok és a kész oldalak innen letölthetők.
Álljunk is neki!

A negyedik...

A mai feladat ismét egy érettségi lesz... A hármas feladat a miénk. A szükséges fájlok és a kész weboldal innen letölthető!! Mivel az előző leckék tördelése nem az igazi,  ezentúl textarea-kat használok a kódok megjelenítésére. A textarea nagyon hasonlít egy iframe-ra, csak éppen nem weboldalt jelenítünk vele meg, hanem szöveget. Majd lesz róla lecke, de azért itt a szintaxis:
<textarea>Ide kerül a szöveg!</textarea>


Álljunk is neki:

A paprika csíp...

Folytatjuk az érettségi feladatok gyakorlását. Ezeknek nem az a célja, hogy átmenjünk az érettségin, hanem az eddig megtanult tag-ek, attribútumok és értékek gyakorlása. Jövő héttől folytatjuk a W3-as tananyagot. Utána pedig áttérünk a CSS-re.

A mai feladat itt található. A mi részünk a 2B. Álljunk is neki.

A második feladat

Ma megnézünk egy másik érettségi feladatot :)
Ha valami nem érthető  kódban, akkor először menj végig az eddig megtanult leckéken, ha utána sem érted, hogy miért van, akkor írj egy hozzászólást.
A feladat innen letölthető. A 3-as a miénk. Kezdjünk is neki:

Az első feladat...

A W3-as tananyag kezdő szintjének vége, de a tanulásnak koránt sem. Egy darabig még gyakorolni fogunk, hiszen weboldalt sem fejben szokás csinálni. Mivel sok ötletem nincs, az eddigi érettségi feladatokat fogjuk megnézegetni. Gyakorlásnak megfelel az is :D

Nézzük is meg a 2011. májusi feladatot.

Innen elérhető. A 2. feladat a miénk. 

Van benne egy kis grafika is. Azt nem csináljuk mi most meg. Ajánlom, hogy először mindenki mennyen végig a feladaton maga. Csak az után nézd meg a megoldást itt, ha már kész vagy, vagy ha tényleg nem tudod, hogy mit kell csinálni.