Elemente principale HTML

Ce este HTML? (Hypertext Markup Language)

Este un set de coduri logice care constituie aparitia unui document web si a informatiilor pe care le detine. Codurile sunt scrise intre "<" (paranteza deschisa) si ">" (paranteza inchisa), cu toate ca nu sunt chiar paranteze, asa se numesc si arata astfel: < >

Exemplu:

<body> sau <font>

Cele mai multe elemente (numite si tag-uri) au un element (tag) de deschidere si un element de închidere distins prin "/" in interiorul parantezei deschise "<".

Exemplu:

<openingtag> continut </closingtag>
<font> text </font>

- Primul cuvânt care apare înauntru "<" se numeste element sau eticheta HTML si spune browser-ului sa faca ceva, precum <font>

- Cuvintele care urmeaza dupa element in interiorul "< >"se numesc atribute care descriu proprietatile elementului. Cum ar fi : culoarea, marimea, etc.

- Atributele sunt separate prin spatiu si urmate de semnul egal "=", dupa care sunt scrise, intre ghilimele (" ") valorile atributelor.

- Astfel, o eticheta HTML poate contine elementul de identificare, atribute si valori.

- In urmatorul exemplu elementul este font atributul color si valoarea blue:

<font color="blue">Acest text va fi albastru</font>
Browser:
Acest text va fi albastru

Structura documentului HTML

-Un document (fisier) HTML este alcatuit din mai multe elemente si atributele lor.

- La început un element html cuprinde (înconjoara ) datele documentului. Acest element contine doua sub-elemente principale: head si body. In head se poate adauga titlul paginii web si alte elemente numite metatag-uri, precum si scripturi JavaScript si stil-uri CSS. In body se adauga continutul documentului care va fi afisat in pagina web.

Exemplu:

<html>
  <head>
    <title>Titlul documentului</title>
  </head>
  <body>
    Continutul paginii
  </body>
</html>

Structura generala a unui document HTML

<html>
 <head>
  <title>titlu</title>
  <link rel="stylesheet" type="text/css" href="styles/style.css" />
  <link rel="shortcut icon" href="favicon.ico" type="image/x-icon"/>
  <meta http-equiv="content-type" content="text/html;charset=utf-8" />
 </head>
 <body>
  <h1>Heading 1</h1>
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  <script type="text/javascript" src="scripts/script.js"></script>
 </body>
</html>

<head> Acest tag urmeaza imediat dupa <html> si este folosit pentru a indica browser-ului, informatii utile precum: titlul pagini, continulul (folosit de motoarele de cautare) si multe altele

<title> Aici se scrie titlul documentului, cat mai sugestiv, si se încheie cu </title>

<link> Indica o relaţie dintre document si alte obiecte de pe WEB. Se încheie cu </link> sau mai simplu <link />

<meta> Aici sunt scrise informaţii cum ar fi tastatura (limbaj) folosita, descrierea si cuvinte cheie care pot fi găsite de motoarele de căutare.

<script> Conţine oricare din JavaScript sau VB Script.

<style> Conţine informaţii privind stilul, grafica informaţiilor care vor apărea pe pagina.

<body> Etichetele HTML si continutul documentului care va fi afisat in pagina web sunt incluse in acest element. Aici pot fi puse si elemente cum ar fi: <script> </script>