1. Főoldal
  2. Cikkek
  3. Dev
  4. HTML Alapok

HTML Alapok

Dev

Hát... ez az első cikkem itt, úgyhogy kérlek, ne gúnyoljatok ki érte ...
[hr]
Első lépések
Szükségünk lesz egy ingyenes tárhelyre... Például: Hostinger...
Regisztrálunk rá, majd kezdhetjük is a munkát!
FIGYELEM!!! Mindegyik tárhelynek saját, vezérlőpanelnek nevezett irányítópultja van... Ezért én nem adhatok több felvilágosítást az ingyenes tárhelyekről :/
[hr]
Ha nem tárhelyet szeretnénk, könnyen megoldhatjuk a weboldalkészítést egy CMS-el... A CMS hasonlít a tárhelyhez, viszont itt sokkal többet tehetünk meg. Sőt... nem is kell feltöltenünk HTML, CSS, stb. fájlokat, hogy működőképes weboldalt hozzunk létre... Az CMS, amit jelen pillanatban is használok és nagyon meg vagyok elégedve a uCoz
[hr]
De most hagyjuk ezeket! Térjünk rá a lényegesebb dolgokra!
[hr]
[hr]
HTML (HyperText Markup Language)
Tudom, kezdetben rémisztőnek hangzik, de higgyétek el, nem az!
A HTML szerkezete nem is olyan furcsa... Körülbelül így néz ki:

 <!----- A HTML alap része. Minden dokumentum ezzel kell hogy kezdődjön -----!> <!----- A HTML bevezető, implementáló része -----!>
 Ez a honlap címe... Nem az URL, hanem a címsorban megjelenő szöveg. Mindig a HEAD részbe kerül és csak egy lehet belőle!
<!---- Minden "tag" (ejtsd: teg) amit elkezdtünk két "kacsacsőr" között kell hogy legyen, és a záró-tag mindig ugyanaz, mint a kezdő, csak az első "kacsacsőr" után van egy / ----!>
<!---- Nem annyira kötelező kód ----!>
IDE JÖHET BÁRMILYEN HTML KÓD! EZEKRŐL LENNÉBB TANULUNK!


Persze vannak bonyolultabb weboldalak is, de mindegyiknek ez az alapja!
[hr]
1. Alapvető szövegformázások
a) Félkövér, Dőlt, Aláhúzott szöveg:
Félkövér:
Ha egy szöveget félkövéren szeretnénk félkövéren írni, csak a következő kódot kell beillesztenünk:

Félkövér szöveg (ide jöhet bármi)




Dőlt:
Ugyanolyan, mint a félkövér, csak itt a b (Bold) helyett i taget (Italic) írunk...

Dőlt szöveg




Aláhúzott
Angolul underline, tehát már gondolhatod, mi a tagje...

Aláhúzott szöveg




b) Szöveg pozíciója: (balra, középen, jobbra)
Két különböző formában tehetjük meg:
 - Könnyebb módszer:

Bal oldalon lesz ez a szöveg
Középre lesz helyezve ez!

Ez meg jobb oldalon



 - Nehezebb módszer:
Ez DIV-es módszer... A DIV a stílusok fő tagje... Ezzel állíthatjuk be, hogy egy adott ponton a CSS melyik osztályát vegye figyelembe. Ez akkor jó, ha több mindent állítunk be stílusnak. Ilyenkor létrehozunk egy osztályt a CSS-ben és ... de mi a szövegelhelyezésnél maradtunk... tehát, a kód:

Bal oldal
 
Középen
 
Jobb oldal



c) Felsorolás
Itt egy ici-picit bonyolultabb a dolog, de nem annyira...

      <!----- A felsorolás kezdete -----!>

 

    • Első elem

 

    • Második elem

 

    • Harmadik elem

 

    • ....

 

 <!----- A felsorolás vége -----!>



d) Számozás
Ugyanaz, mint a felsorolás, csak itt az ul tag helyett ol van:

      <!----- Számozás kezdete -----!>

 

    1. Első elem

 

    1. Második elem

 

    1. Harmadik elem

 

    1. ...

 

 <!----- és vége -----!>



2. Sorközök


<!---- Új sor... Ide nem kell záró-tag! ----!>

 <!---- Vízszintes vonal. Ide sem kell záró-tag. ----!>




3. Kép
Először is... kell egy kép URL címe... tehát a képnek már az Interneten kell lennie. Ha egy, a gépünkön levő kép útvonalát adjuk meg, az nekünk ugyan látszódik, de CSAKIS nekünk... Tehát a világháló többi felhasználójának nem!

Ha rámutatunk a képre ez a szöveg fog megjelenni
<! ------------------------ !>
<!----- width=szélesség - lehet pixelben (pl. 1024px) vagy százalékban (pl. 32%)  -----!>
<!----- height=magasság - lehet pixelben (px) vagy százalékban (%) -----!>




4. Link

Link szövege vagy kép
<!-----------------------!>
<!----- * A hely, ahol megjelenjen az oldal:
target="_self" - azonos ablakban
target="_blank" - új ablakban -----!>





5. Betűszín (tudtam, hogy valamit kifelejtek!)


<color="red>Piros szöveg
<color="blue>Kék szöveg
<color="#00FF00">HTML színkód




EZEK VOLTAK A HTML ALAPOK, EGYBEN AZ ELSŐ BLOG PUBLIKÁLÁSOM! REMÉLEM TETSZETT ;)


bigblog profilképe
Sallai József @bigblog +189 Egy srác akit nagyon érdekel a technológia, a fejlesztés és az alkotás.
4 hozzászólás
Hozzászóláshoz jelentkezz be vagy Regisztrálj!
@nyerek01: Tervbe van, hamarosan lehet szerkeszteni, de még törölni is :)
2014.01.08 17:21
Az első kommentemet nem ehhez a cikkhez szántam, elnézést. (Bár megjegyzem hogy a fórummotornak illene olyannak lennie hogy kezelje a hozzászólás-módosítást...)
2014.01.08 16:43
A cikkben szóba hozod a CSS-t is, ennek ellenére a HTML-ben csinálsz olyat amire ott van a jobb eszköz. A tartalmat leírjuk a HTML fájlba, simán, egyszerűen, majd a CSS fájlt úgy írjuk meg hogy az szépen feldíszítse a szöveget és egyéb objektumokat.
2014.01.04 20:34
Csinálj egy jól működő számológépet, azt nevezheted programnak, amire a kezdő programozó büszke is lehet, de ez...
Remélem nem érted félre, de illik az embernek önmagával szemben is kritikusnak és őszintének lennie.
2014.01.04 20:31