Css HTML

Introducere CSS

CSS a fost creat pentru a usura munca programatorilor. Ca sa faci un design la site, trebuia sa scrii la majoritatea tagurilor multe atribute care sa afiseze tagul sub o anumita forma. Trebuia sa pozitionezi tagul sau sa-i dai culoare sau sa pui un font la text ca atribut al tagului care vroiai sa fie intr-un anumit fel. Era necesar sa faci aceste lucruri pentru fiecare tag chiar daca erau doua taguri la fel, trebuia sa-i scrii si celui de-al doilea aceleasi atribute. Problema cea mare are daca aveai multe pagini la un site, scriai la fel pentru toate paginile.

CSS rezolva aceste probleme. Paginile unui site au acelasi still, acelasi design, CSS separa stilul tagurilor de taguri si da posibilitatea de a pune toate stilurile in sectiunea HEAD a unei pagini HTML sau intr-un fisier extern style.css la care se leaga paginile HTML .

Acum daca avem stilul tagurilor unei pagini intr-un fisier style.css putem sa legam toate paginile site-ului la acel fisier.

Exemplu fara CSS:

<font color="#0000CC" face="Arial" size="+1">Text 1</font><br> 
<font color="#0000CC" face="Arial" size="+1">Text 2</font><br> 
<font color="#0000CC" face="Arial" size="+1">Text 3</font><br> 
<font color="#0000CC" face="Arial" size="+1">Text 4</font><br> 
<font color="#0000CC" face="Arial" size="+1">Text 5</font><br> 
<font color="#0000CC" face="Arial" size="+1">Text 6</font><br> 
<font color="#0000CC" face="Arial" size="+1">Text 7</font><br> 
<font color="#0000CC" face="Arial" size="+1">Text 8</font><br>

Acelasi exemplu cu CSS:

<style type="text/css">
font{
	color:#0000CC;
	font-family:Arial;
	font-size:+1;
}
</style>
<font>Text 1</font><br> 
<font>Text 2</font><br> 
<font>Text 3</font><br> 
<font>Text 4</font><br> 
<font>Text 5</font><br> 
<font>Text 6</font><br> 
<font>Text 7</font><br> 
<font>Text 8</font><br>

Binenteles daca utilizati CSS nu inseamna ca nu puteti sa-l folositi si pentru fiecare tag in parte. Exista cazuri in care e mai bine sa folositi css langa tag.

<font style="color:#0000CC;font-family:Arial;font-size:+1;"
>Text 1</font><br>