Fiecare pagina html e un text-document cu extensia *.html. Pentru a crea o pagina deschidem aplicatia de origine a windows-ului NotePad sau WordPad, insa pentru cei mai avansati recomand NotePad2. In program codam documentul html dupa care il salvam cu extensia *.html. Se face astfel:
Sus, la bara de meniuri click File => Save as. La filename scriem: numedocument.html
numedocument fiind numele pe care il alegem noi. Atentie: Nu trebuie scris cu space! Se accepta doar _ si nici intr-un caz spatiu liber (space).
. se foloseste in cazurile cand dupa acesta urmeaza o alta extensie.
html este extensia unei pagini web.
Sa ne amintim...
Nu uitati structura!
Cod:
<html>
<head>
<title>Titlul paginii web!</title>
<meta name="description" content="Tutoriale Coding si Web-Design" />
<meta name="keywords" content="tutoriale,css,html,extrem tutorials" />
</head>
<body>
Continutul paginii!
</body>
</html>
Atribute si proprietati
Proprietatile atributelor controleaza un sir de tag-uri modificand-ule marimea, latimea, culoarea, mai pe scurt personalizand-ule.
Elementul :
Elementului BODY ii putem da niste atribute cu care putem modifica culoarea de fundal, sau sa-i dam o imagine de fundal. In caz ca nu ii vom da nici un atribut elementului el va ramaine de origine, setat de browser. Deci, depinde de ce browser folositi. De obicei fundalul alb si text-ul negru.
Pentru a seta culoarea de fundal vom adauga atributul bgcolor ca in exemplul de mai jos:
Cod:
<body bgcolor="culoare_hex">
culoare_hex - o culoare de tip hex folosita in HTML. [Pentru codurile culorilor urmariti urmatoarea lectie]
Insa, nu este obligatoriu sa folosim o culoare hex, putem doar scri numele culorii pe limba engleza. Cateva culori mai jos:
red - rosu
orange - oranj
yellow - galben
blue - albastru
cyan - albastru deschis
darkblue - albastru inchis
green - verde
black - negru
gray - sur
white - alb
Si un exemplu:
Cod:
<body bgcolor="red">
Pentru a seta imaginea de fundal vom adauga atributul bgcolor ca in exemplul de mai jos:
Cod:
<body background="imagine.extensie">
imagine.extensie - imaginea folosita ca background si extensia acesteia. In caz ca imaginea nu se afla in aceeasi mapa unde si documentul va trebui sa indicam si directorul spre imagine. Exemplu:
Cod:
<body background="razvan/web/images/imagine.extensie">
Text-Link :
Text-link-ul se realizeaza printr-un simplu cod html:
Cod:
<a href="link">Click aici!</a>
Inlocuim link cu link-ul cu care dorim sa facem legatura.
Inlocuim Click aici! cu text-ul pe care vom da click.
Imagine-Link :
Imagine-link se realizeaza printr-un cod simplu dar mai complicat:
Cod:
<a href="link"><img src="imagine.extensie" /></a>
Inlocuim link cu link-ul cu care facem legatura.
Inlocuim imagine.extensie cu directorul spre imagine sau link-ul spre imagine cat si extensia acesteia.
Deschiderea / Editarea / Salvarea
Pentru a deschide documentul salvat dam dublu-clik pe el, sau click dreapta, open with si alegem browserul pe care il folositi, cum ar fi Mozilla Firefox.
Pentru editarea acestuia dam click dreapta pe el open with si alegem text-editorul pe care il folositi, cum ar fi NotePad. Deja ne va aparea codurile pe care le-am scris mai devreme. Putem sa le modificam cum dorim in orice moment.
Daca dorim salvarea documentului click File apoi save. Succes !
Tutorial scris de [Trebuie sa fiti inscris si conectat pentru a vedea acest link]
Copyright Extrem-Tutorials.com - Nici o parte a acestui tutorial nu poate fi reprodusa fara acordul autorului.