Va intrebati ce este CSS-ul…
…diferite modalitati de afisare ale paginilor HTML, numite si stiluri. Stilul se refera la culori, fonturi, aranjare in pagina, stilul hyperlink-urilor,etc. CSS sau “Cascading Style Sheets” ajuta la afisarea elementelor de HTML in functie de instructiunile definite de designer.
Sintaxa unui stil…
….un tuplu de trei elemente: selector, proprietate si valoare.
selector {proprietate: valoare}
Ex:
h1 {color: green}
Daca punem mai multe atribute…
…le putem pune pe mai multe linii pentru o mai buna percepere
p {
color:black ;
font-family=arial ;
background-color:red
}
Daca vrem mai multe stiluri…
…pentru acelasi element HTML folosim clasa.identificator
h1.green {color:green}
h1.red {color:red}
<h1 class="green">Hello</h1>
<h1 class="red">Hello!</h1>
Daca vrem un stil pentru mai multe elemente HTML …
…atunci vom renunta la clasa (elementul HTML)
.left {text:align: left}
<p class="left">Hello world</p>
Unde putem defini stiluri CSS...
…se pot defini in patru locuri:
- nivelul 1 al browser-ului
- nivelul 2: intr-un fisier extern, salvat cu extensia .css
- nivelul 3: in interiorul HTML-ului in cadrul <head>
- nivelul 4: chiar in interiorul elementului
Nivelul 2: intr-un fisier .css
<head>
<link rel="stylesheet" type="text/css"
href="un_stil_definit.css" />
</head>
Nivelul 3: in cadrul <head>
<head>
<style type="text/css">
h1 {color: red}
p {font-family=arial }
</style>
</head>
Nivelul 4: in interiorul elementului
<p style="color: red; font-family=arial">
Hello world
</p>
Spor la CeSeSe!
Leave a comment