Invata bazele HTML
Invata bazele HTML. Un tutorial simplu. Este dedicat incepatorilor in limbajul HTML.
Vei invata ca a face o pagină de web este într-adevăr foarte simplu.
Totul se rezuma la un fisier text cu extensia html.
HTML = Hyper Text Mark-up language
Limbajul HTML utilizează “etichete” (tags), astfel încât browserele sa stie cum sa afiseze link-uri, text şi imagini.
Elementele HTML sunt notate astfel:
<numele elementului> De exemplu: <body>, <header>
Cele mai multe elemente sunt, de obicei, asociate cu elemente de sfarsit.
Exemplu:
1 | <html> si </html>; <body> si </body>; <title> si </title> |
Pentru a intelege mai usor, o sa dau exemplu cea mai simpla pagina HTML:
1 2 3 4 5 6 7 8 | <html> <head> <title>Titlul meu</title> </head> <body> Pagina mea web in HTML. </body> </html> |
Codul de mai sus va afisa in o pagina web cu titlul “Titlul meu” si va contine:
Pagina mea web in HTML
Unele elemente permit utilizarea de atribute care pot avea anumite valori:
1 | <eticheta atribut="valoare"> ... </eticheta> |
Tag-ul <html> spune browser-ului că dosarul conţine coduri HTML şi trebuie să fie primul lucru care apare în document, în timp ce tag-ul final </html> trebuie să fie ultimul lucru
Elementul <head> conţine informaţii generale, numite meta-informaţii, despre un document. Meta înseamnă “informaţii despre”.
Conform standardului HTML, numai câteva tag-uri sunt legale în interiorul elementului <head> . Acestea sunt:
1 | <base>, <link>, <meta>, <title>, <style>, şi <script> |
Tag-ul conţine informaţii pe care dorim sa le afisam pe pagina de web.
Copiaza codul de mai sus intr-un fisier text si salveaza-l sub denumirea index.html apoi deschide fisierul cu un browser gen Internet Explorer, Mozilla Firefox sau Google Chrome.
Pentru a vedea codul HTML corespunzator paginii afisate in browser, selectati View, Document Source.
Cateva din elementele unei pagini web explicate pe scurt
Heading
Acestea sunt notate de la incepand de la < h1 > pana la < h6 > si pot reprezenta rubricile paginii.
Exemplu de cod:
1 2 3 | <h1>Rubrica cu marime text foarte mare</h1> <h2>Rubrica cu marime text mare</h2> <h3>Rubrica cu marime text medie</h3> |
Vizualizare HTML:
Rubrica cu marime text foarte mare
Rubrica cu marime text mare
Rubrica cu marime text medie
Linkuri
Acestea sunt definite de tagul < a >
Exemplu de cod:
1 | <a href="http://eajutor.ro">Legatura catre siteul Eajutor.ro</a> |
Vizualizare HTML:
Imagini
Imaginile sunt definite de elementul < img >
Exemplu de cod:
1 | <img src="eajutor_logo.jpg" width="100" height="50" /> |
Acest element va afisa in pagina web imaginea corespunzatoare fisierului eajutor_logo.jpg aflat pe server.
Paragrafe
Paragrafele sunt definite de elementul < p >
Exemplu de cod:
1 2 | <p>Acesta este un paragraf.</p> <p>Alt paragraf.</p> |
Vizualizare HTML:
Acesta este un paragraf.
Alt paragraf.
Tutoriale asemanatoare:
Lasă un comentariu!