Scribd
Încărcați
4 vizualizări3 pagini

CSS Extern Intern Inline

Documentul prezintă trei modalități de a adăuga CSS la un document HTML: prin intermediul unui fișier extern (.css), intern în secțiunea <head> sau inline în tag-ul HTML vizat. Ordinea de prevalență este: inline, intern, extern.

Încărcat de

GHEORGHIŢA VASILE
Drepturi de autor
© © All Rights Reserved
Respectăm cu strictețe drepturile privind conținutul. Dacă suspectați că acesta este conținutul dumneavoastră, reclamați-l aici.
Formate disponibile
Descărcați ca DOCX, PDF, TXT sau citiți online pe Scribd
4 vizualizări3 pagini

CSS Extern Intern Inline

Documentul prezintă trei modalități de a adăuga CSS la un document HTML: prin intermediul unui fișier extern (.css), intern în secțiunea <head> sau inline în tag-ul HTML vizat. Ordinea de prevalență este: inline, intern, extern.

Încărcat de

GHEORGHIŢA VASILE
Drepturi de autor
© © All Rights Reserved
Respectăm cu strictețe drepturile privind conținutul. Dacă suspectați că acesta este conținutul dumneavoastră, reclamați-l aici.
Formate disponibile
Descărcați ca DOCX, PDF, TXT sau citiți online pe Scribd
Sunteți pe pagina 1/ 3

CSS – Extern, intern sau inline

Codul CSS se poate stoca in trei locuri si anume:

 fisier extern (.css)


 intern - in head
 in tagul care se vrea personalizat (inline)

CSS - Fisier .css extern


In general fisierele externe de CSS sunt cele mai folosite. Este de
recomandat utilizarea acestei metode pentru o mai simpla modificare a
intregului website. In acest fel se poate modifica un site intreg schimband
continutul unui singur fisier .css. Singura conditie este ca toate paginile site-
ului sa contina in sectiunea head tag-ul <link>.

HTML
<head>
<link rel="stylesheet" type="text/css" href="fisier_extern.css" />
</head>
Un fisier CSS se poate scrie in orice editor de text, notepad, notepad++, word,
macromedia, etc dar trebuiesc salvate cu extensia ".css"

Un exemplu simplu de cod CSS ar fi urmatorul

CSS
body { background-image: url("img/imagine.png"); }
hr { color: #efefef;}
p { margin-left: 15px;}
Observatie: NU trebuie lasat spatiu intre numarul specificat si unitatea de
masura. Folosind "margin-left:15 px;" in loc de "margin-left:15px;" va genera
erori in Firefox si Opera.

CSS intern
Codul CSS in head, nu ar trebuii folosit prea mult cu exceptia cazului cand o
pagina are nevoie de un stil propriu si nu il imparte cu nici o alta pagina.

Codul CSS intern este acelasi ca si la cel introdus intr-un CSS extern., cu
exceptia unor taguri speciale care il incapsuleaza.

Exemplu:

HTML
<head>
<style type="text/css">

body { background-image: url("img/imagine.png"); }


hr { color: #efefef; }
p { margin-left:15px;}

</style>
</head>
Pentru a plasa CSS in HTML am folosit tagul <style> impreuna cu
atributul type="text/css", plasat in sectiunea head a documentului HTML.

CSS inline
CSS inline nu inseamna nici mai mult nici mai putin decat CSS in interiorul
tagului HTML. Folosind CSS-ul sub aceasta forma vom pierde toate avantajele
pentru care a fost creat si anume pontru a nu amesteca tagurile HTML cu
formatarea si prezentarea lor. Exista totusi si avantaje in a folosi CSS-ul in
aceasta maniera dupa cum vom vedea. Dar mai intai sa vedem cum anume se
poate introduce CSS intr-un tag HTML.

HTML
<p style="text-align:right;color:green;font-family:'times new roman';margin-
left:15px;">Acesta este un paragraf formatat cu ajutorul CSS.</p>

Observatie:

Dupa cum se observa in exemplu anterior valoarea fontului este o valoare


compusa din trei cuvinte. In acest caz in loc de ghilimele duble am folosit
ghilimele simple pentru a evita conflictul cu ghilimele duble folosite pentru a
incapsula valoarea atributului style.

Daca am folosii acelasi tip de ghilimele peste tot, browser-ul ar intrerpreta


sfarsitul valorii inainte de vreme. Iata bucata de cod CSS care va fi
interpretata de browser:

CSS
style="text-align:right; color:green; font-family:"

Restul codului CSS fiind ignorat.

Prevalenta metodelor de a insera


CSS in documentele HTML
Codul CSS se poate insera in HTML in urmatoarele moduri:

 fisier extern (.css)


 intern - in head
 in tagul care se vrea personalizat (inline)

Desigur codul CSS se poate insera in HTML combinand doua sau chiar toate
cele trei moduri anterioare.

Atunci cand formatam un element si folosim mai multe modalitati de inserare


a CSS-ului, ordinea de reproducere in browser va fi urmatoarea:

1. Formatare CSS inline (in interiorul tag-ului HTML)


2. Formatere CSS interna (in sectiunea head a documentului)
3. FormatareCSS externa (fisier .css extern)
4. Standardul browser-ului (valori CSS atribuite standard)

Concluzie
Formatarea inline anuleaza toate celelalte expresii CSS de formatare. Iar
standardele de formatare ale browser-ului intervin doar atunci cand nu este
specificata o alta formatare CSS.

Exceptie:
In cazul in care tagul <link> este pus dupa tagul <style> codul CSS aflat in
fisierul .css extern va anula codul CSS intern.

HTML
<head>

<style type="text/css">
body { background-image: url("img/imagine.png"); }
hr { color: #efefef;}
p { margin-left: 15px;}
</style>

<link rel="stylesheet" type="text/css" href="fisier_extern.css" />

</head>

S-ar putea să vă placă și