Codurile CSS pot fi scrise in interiorul paginii sau intr-un fisier extern cu extensia".css".
Codul CSS, ca forma generala, este alcatuit din: obiectul care va fi formatat. proprietatile acestuia si valoarea (sau atributele) fiecarei proprietati.
Cand este adaugat in documentul HTML, trebuie scris in cadrul unui tag <style> in sectiunea HEAD a documentului HTML, dupa cum se vede in formula generala de cmai jos;

<html>
<head>
<title>Titlul</title>

<style type="text/css">
obiect_css {
 proprietate:valoare;
 alta_proprietate:valoare;
}
</style>
</head>
<body>
... Continut ...
</body>
</html>
- Observati sintaxa codului CSS. Perechile proprietate:valoare se scriu intre acoladele obiectului CSSpe care-l definesc, intre "proprietate" si "valoare" trebuie sa fie un caracter doua-puncte (:) iar la sfarsitul perechii se adauga un caracter punct-si-virgula (;)
- Cand este adaugat intr-un fisier extern ".css", codul CSS se scrie la fel, dar nu se mai adauga tag-ul <style>.

1. Obiectele (regulile) CSS

Exista trei tipuri principale de obiecte CSS: selector, clasa si identificator.

- Selectorul HTML

Selectorul HTML se foloseste pentru a redefini modul de afisare a continutului etichetei HTML.
Un selector HTML reprezinta partea etichetei HTML care indica navigatorului tipul de eticheta.
Iata un exemplu:

h1 { font-family:"Arial"; font-size:15px; }
- Aici selectorul este "h1".
Definirea unui selector HTML folosind CSS are ca rezultat redefinirea etichetei HTML. Selectorul si eticheta desi par identice, totusi nu sunt.

- Clasa

Clasa este un obiect care poate fi aplicat oricarei etichete HTML.
O clasa trebuie creata in interiorul etichetei HTML inainte de a fi definita intr-un cod CSS. Crearea clasei in interiorul etichetei se face simplu, prin specificarea cuvantului class si numele clasei, ca in exemplu de mai jos: - "nume_clasa", poate fi orice nume dorim.
- Apoi in interiorul codului CSS, clasa trebuie definita prin adaugarea unui caracter punct (.) inaintea numelui clasei, ca in exemplu urmator:
.nume_clasa { font-family:"Arial"; font-size:15px; }
Numele aceleasi clase poate fi atribuit mai multor etichete HTML din aceeasi pagina, si toate vor prelua acelasi stil css.

- Identificator

Obiectele de tip identificator (ID) sunt asemanatoare cu clasele. Pot fi aplicate oricarei etichete HTML, dar spre deosebire de clase, numele unui identificator trebuie atribuit numai unei singure etichete HTML dintr-o pagina, pentru alta eticheta se adauga un ID cu nume diferit.
Ca si clasa, identificatoru trebuie intai creat in interiorul etichetei HTML. Modul de creare este simplu, prin specificarea cuvantului id si numele clasei, ca in exemplu de mai jos: - "nume_id", poate fi orice nume dorim.
In interiorul codului CSS, identificatorul este definit prin adaugarea unui caracter diez (#) inaintea numelui, ca in exemplu urmator:
#nume_id { font-family:"Arial"; font-size:15px; }

In urmatoarea lectie va fi explicat mai amanuntit modul de definire si rolul acestor obiecte CSS .

2. Componentele unui obiect CSS

Obiectele CSS, indiferent de tipul lor, au in componenta urmatoarele elemente:

Sintaxa generala a unei reguli CSS este urmatoarea: Proprietatile si valorile constituie definitia regulii (obiectului) CSS. Acestea se regasesc sub forma de perechi,despartite de caracterul doua puncte ”:”, fiecare pereche se termina cu un caracter punct si virgula ";".
Etichetele HTML nu sunt sensibile la diferenta intre majuscule si litere mici. Dar odata cu aparitia limbajului XHTML, acesta face distinctie intre majuscule si minuscule, astfel ca toate etichetele si toti selectorii trebuie scrisi cu litere mici.

Un Test simplu in fiecare zi

HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Ce tag se foloseste pentru a adauga liste in elemente <ul> si <ol>?
<dt> <dd> <li>
<ul>
 <li>http://coursesweb.net/html/</li>
 <li>http://www.marplo.net/html/</li>
</ul>
Care valoare a proprietatii "display" seteaza elementul ca tip bloc si afiseaza un punct in fata?
block list-item inline-block
.some_class {
  display: list-item;
}
Care instructiune JavaScript transforma un obiect in sir JSON.
JSON.parse() JSON.stringify eval()
var obj = {
 "courses": ["php", "javascript", "ajax"]
};
var jsonstr = JSON.stringify(obj);
alert(jsonstr);    // {"courses":["php","javascript","ajax"]}
Indicati clasa PHP folosita pentru a lucra cu elemente HTML si XML in PHP.
stdClass PDO DOMDocument
$strhtml = '<body><div id="dv1">CoursesWeb.net</div></body>';
$dochtml = new DOMDocument();
$dochtml->loadHTML($strhtml);
$elm = $dochtml->getElementById("dv1");
echo $elm->nodeValue;    // CoursesWeb.net
Indicati forma de Prezent Continuu a verbului "to live" (a trai /a locui)
lived living liveing
I`m living here.
- Traiesc /Locuiesc aici.
Care este forma de Gerunziu (sau Participiu Prezent) a verbului "vivir" (a trai /a locui)?
vivió vivido viviendo
Estoy viviendo aquí.
- Traiesc /Locuiesc aici.
Scriere cod CSS

Last accessed pages

  1. Prezentul simplu si continuu - Present Tense Simple and Continuous (2252)
  2. English Tests and exercises - Grammar (1112)
  3. Clasificarea adverbelor - Adverbs classification (194)
  4. Kids Park (6)
  5. Programe pentru invatare limba Spaniola (127)

Popular pages this month

  1. Bubbles3 (3188)
  2. Gramatica limbii engleze - Prezentare Generala (2483)
  3. Prezentul simplu si continuu - Present Tense Simple and Continuous (2252)
  4. Butterfly Kyodai (2022)
  5. Zuma Deluxe (1953)