Cum se creează CSS (cu ilustrații)

CSS este limba tabelelor de stil prin care puteți crea pagini web și controlați simultan mai multe funcții, atribuind grupuri de anumite elemente. De exemplu, folosind codul de culoare, designerul poate schimba culoarea de fundal pe toate paginile site-ului, făcând o modificare a codului CSS.

Pași

Partea 1 din 4:

Cum să scrieți un cod CSS încorporat

unu. Verificați etichetele HTML. Trebuie să știți cum funcționează etichetele și atributele SRC și href.

2. Explorați o parte din Proprietățile principale ale CSS. Există multe proprietăți, dar nu vă amintiți totul.

Amintiți-vă următoarele proprietăți cheie CSS: Culoare și Familie de fonturi.

3. Examinați valorile proprietăților corespunzătoare. Pentru fiecare proprietate indică valoarea. De exemplu, pentru proprietăți Culoare Puteți specifica valoarea roșu.

4. Verificați atributul HTML Stil. Se utilizează în interiorul elementului href sau SRC. Pentru a utiliza atributul specificat, în Citate după semnul egal, introduceți atributul CSS, colon și apoi valoarea proprietății. Aceasta se numește regulă CSS.

cinci. Vă rugăm să rețineți că dezvoltatorii web profesioniști de obicei nu utilizează codul CSS încorporat pentru a crea site-uri. Codul CSS încorporat poate întrerupe integritatea codului HTML. Cu toate acestea, aceasta este o modalitate excelentă de a se familiariza cu fundamentele funcționării CSS.

Partea 2 din 4:

Cum de a scrie un cod simplu CSS

unu. Rulați programul în care puteți crea fișiere HTML și CSS.

Dacă nu există un program special, utilizați un notepad sau alt editor de text. Doar salvați fișierul ca fișier text și fișier CSS.

2. Deschideți codul HTML. Fă-o într-un editor HTML (dacă este).

În editorul HTML puteți lucra cu cod HTML și cu cod CSS.

3. Creați etichetă Tag-ul INHTML . În acest caz, codul CSS poate fi scris fără a fi nevoie să creați un fișier separat.

4. Selectați elementul la care doriți să adăugați stil. Acum introduceți numele elementului și parantezele curbate ({ }). Pentru a face codul mai inteligibil, cel de-al doilea suport curly intră întotdeauna pe noua linie.

cinci. În interiorul parantezelor introduceți regula CSS ca și cum ați utiliza un atribut Stil. Fiecare șir trebuie să se încheie cu un punct și virgulă (-). Pentru a face ca codul să fie rupt, fiecare regulă este introdusă pe o linie separată, iar fiecare linie trebuie să aibă o liniuță.

Vă rugăm să rețineți că acest stil va afecta toate elementele tipului selectat de pe pagină. Un stil mai specific va fi revizuit în secțiunea următoare.

Partea 3 din 4:

Cum se scrie un cod CSS mai complex

unu. Creați un fișier CSS (și nu un fișier HTML) și salvați-l cu extensia .Css. De asemenea, deschideți un fișier HTML.

2. Creați etichetă Tag-ul INHTML . Deci, veți conecta un fișier CSS separat cu un fișier HTML. Pentru etichetă Sunt necesare trei atribute: Rel, Tip și href.

Rel Specifică browserul Cum se tratează fișierul HTML. Aici acest atribut ar trebui să conteze Stohlesheet.

Tip Rapoartele la ce tip de mass-media se referă la. Aici acest atribut ar trebui să conteze Text / css

href aici este folosit în același mod ca și în element , Dar aici acest atribut trebuie să se refere la fișierul CSS. Dacă fișierul CSS este într-un singur dosar cu un fișier HTML, specificați numele fișierului numai în ghilimele.

3. Selectați elementele de diferite tipuri la care doriți să adăugați un stil. Adăugați un atribut Clasă la astfel de elemente și le echivalează cu numele clasei selectate. În acest caz, elementele vor fi același stil.

4. Specificați ce stil va primi o clasă. În fișierul CSS, introduceți numele clasei după acest punct ., Adică așa: .Clasă.

cinci. Selectați elemente individuale la care doriți să adăugați un stil special și adăugați un atribut ID. Identificatorii CSS sunt creați folosind un simbol #, nu un punct.

Identificatorii sunt mai specifice decât clasele, astfel încât identificatorul suprascrie orice stil de clasă dacă are un atribut cu o altă valoare decât valoarea clasei.

Partea 4 din 4:

Cum să învățați CSS și HTML

unu. Deschideți site-ul Academia HTML. Pe ea puteți afla elementele de bază ale dezvoltării web.

2. Găsiți alte site-uri special concepute pentru a explora HTML și CSS.Căutați surse autoritare pentru a vă înmulți cunoștințele.

3. Comunicați cu designerii web și dezvoltatorii. Experiența lor vă va ajuta să stăpâniți cunoștințele și abilitățile valoroase.

4. Vizualizați codurile sursă ale site-urilor pe care le deschideți. Vizualizarea codurilor CSS Made site-uri web vă permit să vă familiarizați cu metodele de dezvoltare a unor părți ale site-urilor web. Copiați codul și apoi editați-l pentru a afla cum să utilizați diferite atribute CSS.

sfaturi

Există multe proprietăți diferite care pot fi manipulate folosind CSS. Găsiți un site web dorit și vizualizați fișierul sursă. Dacă tag-urile interioare ale capului au un nume de fișier CSS, faceți clic pe acesta pentru a vizualiza diverse proprietăți și valori atribuite elementelor.

Avertizări

Copierea codurilor HTML și CSS vă va ajuta să vă instruiți, dar trebuie să utilizați propriile idei de designer. Folosind designul altcuiva este furtul și plagiatul.