Crearea de site-uri web

Crearea de site-uri web

Pasul 2. Conectarea CSS

Pentru a adăuga stiluri unei pagini web, există mai multe modalități care diferă în ceea ce privește capabilitățile și scopul. Următoarele sunt modalitățile de a conecta CSS.







Tabel de stiluri legate

Atunci când se utilizează stiluri de tabel descriere asociată selectoarelor și proprietățile lor se află într-un fișier separat, de obicei cu extensia css, și de a se asocia cu documentul este utilizat tag-ul de fișier . Această etichetă este plasată în container . așa cum se arată în Exemplul 2.1.

Exemplul 2.1. Conectarea unui tabel de stiluri asociate

Valorile parametrilor etichetei - relația și tipul rămân neschimbate, după cum se arată în acest exemplu. Argumentul href specifică calea spre fișierul CSS, poate fi specificată atât relativă, cât și absolută. Rețineți că, în acest fel, puteți conecta o foaie de stil care se află pe un alt site.

Conținutul fișierului mysite.css fiind conectat printr-o etichetă este dată în exemplul 2.2.

Exemplul 2.2. Dosar cu stil

Culoarea H1: marină;
font-size: 200%;
font-familie: Arial, Verdana, sans-serif;
text-align: centru
>

P umplutură-stânga: 20px
>

Tabelul de stil global

Când utilizați foaia de stil globală, proprietățile CSS sunt descrise în documentul în sine și sunt de obicei localizate în antetul paginii web. Prin flexibilitatea și capacitățile sale, acest mod de adăugare a unui stil este inferior celui anterior, dar vă permite să plasați toate stilurile într-un singur loc. În acest caz, chiar în corpul documentului, folosind containerul

În acest exemplu, este definit un stil de etichetă

În acest exemplu, stilul etichetei

În acest exemplu, primul antet 36 este dată de dimensiunea de pixeli roșii folosind stilul de linie și următorul - verde prin stiluri de masă la nivel mondial.

Importați CSS

În foaia de stil actuală, puteți importa conținutul fișierului CSS utilizând comanda @import. Această metodă poate fi utilizată împreună cu un tabel de stiluri asociate sau globale, dar nu cu stiluri încorporate. Sintaxa generală este după cum urmează.

@import url ("nume fișier");
@import "nume fișier" tipuri media;

După cuvântul cheie @import, specificați calea spre fișierul de stil într-una din două moduri, utilizând directiva url sau fără ea. Exemplul 2.6 arată cum puteți importa un stil dintr-un fișier extern în foaia de stil globală.

Exemplul 2.6. Importați CSS în foaia de stil globală



Antet 2



Acest exemplu arată conexiunea fișierului header.css. care se află în dosarul de stil.

În mod similar, importul are loc și în fișierul cu stil, care apoi se conectează la document (Exemplul 2.7).

Exemplul 2.7. Importarea în foaia de stil conectată

@import "/style/print.css" print;
@import "/style/palm.css" handheld;

Familia fontului BODY: Arial, Verdana, Helvetica, sans-serif;
font-size: 90%;
fundal: alb;
culoare: negru
>

Acest exemplu arată conținutul fișierului mysite.css. care se adaugă la documentele solicitate în modul prezentat în Exemplul 2.1, și anume prin utilizarea etichetei .

Tipurile de materiale menționate în sintaxa @import sunt descrise mai jos.







Articole similare

Trimiteți-le prietenilor: