Utilizarea site-ului CSS Site Wide
Site-urile web reprezintă o combinație de stil și structură, iar pe site-ul web de astăzi este o bună practică să păstrăm aceste două aspecte ale unui site separate unul de celălalt.
HTML a fost întotdeauna ceea ce oferă un site cu structura sa. În primele zile de pe Web, HTML conținea și informații despre stil. Elemente precum eticheta au fost umplute peste codul HTML, adăugând informații despre aspect și simț alături de informații structurale. Miscarea standardelor web ne-a impulsionat sa schimbam aceasta practica si sa impingem toate informatiile despre stil in CSS sau Cascading Style Sheets. Având un pas mai departe, recomandările actuale sunt că folosiți ceea ce este cunoscut ca o "foaie de stil externă" pentru nevoile dvs. de design de site web.
Avantajele și dezavantajele foilor de stil externe
Unul dintre cele mai bune lucruri despre foile de stil cascadă este că le puteți folosi pentru a menține întregul site consistent. Cel mai simplu mod de a face acest lucru este să conectați sau să importați o foaie de stil externă . Dacă utilizați aceeași foaie de stil externă pentru fiecare pagină a site-ului dvs., puteți fi sigur că toate paginile vor avea același stil. De asemenea, puteți face mai ușor schimbarea pentru viitor. Deoarece fiecare pagină utilizează aceeași foaie de stil externă, orice modificare a foii respective va afecta fiecare pagină de site. Acest lucru este mult mai bine decât să trebuiască să schimbați fiecare pagină individual!
Avantajele foilor de stil externe
- Puteți controla aspectul și simțul mai multor documente simultan.
- Acest lucru este util în special dacă lucrați cu o echipă de oameni pentru a vă crea site-ul web. Multe reguli de stil pot fi dificil de reținut și, deși este posibil să aveți un ghid de stil tipărit, este ineficient și dificil să vă răsturnați continuu pentru a determina dacă textul trebuie scris în 12 puncte Arial font sau 14 point courier. Având totul într-un singur loc și din moment ce acel loc este locul unde veți face schimbări, puteți face întreținerea mult mai ușoară.
- Puteți crea clase de stiluri care pot fi apoi utilizate pe multe elemente HTML diferite.
- Dacă utilizați adesea un anumit stil de font pentru a evidenția diverse lucruri pe pagina dvs., puteți utiliza un atribut de clasă pe care l-ați configurat în foaia dvs. de stil pentru a obține acest aspect și a simți, mai degrabă decât să definiți un anumit stil pentru fiecare instanță a accent.
- Puteți grupa ușor stilurile pentru a fi mai eficient.
- Toate metodele de grupare disponibile pentru CSS pot fi utilizate în foi de stil externe, ceea ce vă oferă mai mult control și flexibilitate pe paginile dvs.
Dezavantajele foilor de stil externe
- Formatele de stil externe pot crește timpul de descărcare, mai ales dacă sunt extrem de mari. Deoarece fișierul CSS este un document separat care trebuie să fie încărcat, acesta va afecta performanța pentru a efectua această descărcare.
- Foile de stil externe se mareresc foarte repede, deoarece este greu de spus când un stil nu mai este folosit, deoarece nu este șters când pagina este eliminată. Administrarea corectă a fișierelor CSS este importantă, mai ales dacă mai multe persoane lucrează la același fișier.
- Dacă aveți doar un site web pe o singură pagină, este posibil să nu aveți nevoie de un fișier extern pentru CSS, deoarece aveți numai acea pagină în stil. Multe dintre beneficiile CSS externe sunt pierdute atunci când aveți doar un singur site de pagină.
Cum se creează o foaie de stil externă
Foile de stil externe sunt create cu o sintaxă similară foilor de stil de document. Cu toate acestea, tot ce trebuie să includeți sunt selectorul și declarația. La fel ca într-o foaie de stil la nivel de document, sintaxa pentru o regulă este:
selector {proprietate: valoare;}Salvați aceste reguli într-un fișier text cu extensia .css. Acest lucru nu este necesar, dar este un obicei bun pentru a intra, astfel încât să puteți recunoaște imediat foile de stil într-o listă de director.
După ce aveți un document de foaie de stil, trebuie să îl conectați la paginile dvs. Web . Acest lucru se poate face în două moduri:
- Legarea
- Pentru a conecta o foaie de stil, utilizați eticheta HTML. Aceasta are atributele rel , tipul și href . Atributul rel spune ceea ce conectați (în acest caz o foaie de stil), tipul definește tipul MIME pentru browser și href este calea către fișierul .css.
- Importul
- Ați folosi o foaie de stil importată într-o foaie de stil de document, astfel încât să puteți importa atributele unei foi de stil externe în timp ce nu pierdeți nici una dintre cele specifice documentului. Apelați-o într-un mod asemănător cu a apela o foaie de stil asociată, numai aceasta trebuie apelată într-o declarație de stil de nivel de document. Aveți posibilitatea să importați cât mai multe foi de stil externe pe cât este necesar pentru a vă menține site-ul web.
Articolul original de Jennifer Krynin. Editat de Jeremy Girard pe 8/8/17