CSS - Cascading Style Sheets

- Tutoriale, exemple si explicatii din care sa invatati, daca exersati si singuri.

Cuprins Lectii :

1 - Scrierea codului CSS

2 - Crearea Foilor de Stil

3 - Configurarea fonturilor

4 - Configurarea textului

5 - Configurari pentru culori si fundal

6 - Controale pentru chenare si afisarea elementelor

7 - Controale de pozitionare

8 - Configurari pentru vizibilitate si mouse

9 - Pseudo-clasele

10 - Pseudo-elemente

CSS3 - Background proprietati noi

• Proprietati noi pt. background, adaugate in CSS3: background-size, background-origin si background-clip.

CSS3 - Border proprietati noi

• Proprietati noi pt. border (bordura), adaugate in CSS3. Rotunjire colturi cu border-radius, adaugare umbra la chenar cu box-shadow, utilizare imagine pt. aspectul bordurii cu border-image.

CSS3 - text-shadow, word-wrap, text-overflow

• Proprietati pentru efecte de text, adaugate in CSS3.

CSS3 opacity

• Setare opacitate si transparenta la elementele HTML cu proprietatea CSS opacity.

CSS3 Transformari 2D

• Transformare elemente HTML in plan 2D (mutare, rotire, redimensionare, distorsie), folosind proprietatea "transform" si metodele: translate(), rotate(), scale(), skew().

CSS3 transition

• Adauga un efect de animatie cand se modifica proprietatile CSS ale unui element HTML, schimband gradual de la un stil la altut.

Pe site-ul coursesweb.net, la sectiunea: CSS - Cascading Style Sheets gasiti o pagina ( Video Tutorials ) cu exemple si lectii video pentru invatarea principalelor elemente CSS.
- Acele tutoriale sunt de initiere pt. incepatori, in limba engleza.
Pe acelasi site, e si o pagina Download, unde gasiti mai multe resurse: PDF e-books si cursuri video pe care le puteti descarca (tot in engleza).

    - Lectii si tutoriale online de initiere CSS - Curs realizat de MarPlo

Un Test simplu in fiecare zi

HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Care meta tag se foloseste pentru scurta descriere a paginii?
<meta content="..."> <meta description="..."> <meta http-equiv="...">
<meta name="description" content="70-160 caractere ce descriu continutul paginii" />
Ce proprietate CSS opreste efectul dat de "float"?
clear text-align position
#some_id {
  clear: both;
}
Clic pe metoda ce creaza un array cu toate elementele din pagina cu un anumit nume de tag.
getElementsByName() getElementById() getElementsByTagName()
var divs = document.getElementsByTagName("div");
var nr_divs = divs.length;
alert(nr_divs);
Indicati functia PHP ce returneaza numarul de elemente dintr-un array.
is_array() count() strlen()
$arr = array(7, 8, "abc", 10);
$nri = count($arr);
echo $nri;        // 4
Indicati adverbul corespunzator adjectivului din paranteza in propozitia: "I live (happy)".
happly happily hapily
I live happily.
- Traiesc fericit (in mod fericit).
Indicati adverbul corespunzator adjectivului din paranteza in propozitia: "Vivo (feliz)".
felizamente felizmente felices
Vivo felizmente.
- Traiesc fericit (cu fericire).
CSS Curs Online Tutoriale CSS web design