No tijekom kodiranja teško je uključiti ista CSS svojstva za svaku web stranicu zasebno. Dakle, potrebno je koristiti rješenje pomoću kojeg se može izraditi jedan stilski list i zatim mu se lako pristupa iz više datoteka.
Što je pravilo @import u CSS-u?
Najbolji način uključivanja svojstava CSS stila je korištenje pravila @import. @import se koristi za uvoz ili pristup CSS tablici stilova iz druge tablice stilova. Ovo smanjuje napor razvojnog programera jer se sva svojstva dodana u uvezenu tablicu stilova implementiraju izravno samo pisanjem @import i zatim točnog naziva lista stilova.
Sintaksa @import pravila
Sintaksa za dodavanje pravila @import za pristup listu stilova iz druge tablice stilova je sljedeća:
@uvoz 'stylesheetname.css' ;
Pravilo @import također se može dodati na sljedeći način:
@uvoz url ( stylesheetname.css ) ;
Jednostavno dodajte naziv datoteke CSS stylesheet u navodnim zarezima ili u okruglim zagradama s ' url 'nakon pisanja' @uvoz ”.
Primjer: Dodavanje pravila @import
Da bismo razumjeli kako funkcionira pravilo @import, napisali smo jednostavan isječak koda:
< h1 > Ovo je jednostavan tekst! < / h1 >U gornjem isječku koda nalazi se naslov
s jednostavnom rečenicom od jednog retka dodanom u HTML dokument. Ovaj jednostavan kod će generirati sljedeći izlaz:
Stvorimo stilsku tablicu za definiranje nekih CSS svojstava koja se kasnije mogu uvesti iz datoteke putem koje je stvoreno gornje sučelje web stranice. Kreiramo drugu datoteku i imenujemo je ' stilski list ' s vrstom datoteke deklariranom kao ' css ”, i jednostavno dodajte neka svojstva za naslov i tijelo
: h1 {
boja : ponoćnoplava ;
boja pozadine : plavetnilo ;
poravnanje teksta : centar ;
}
tijelo {
boja pozadine : svijetlo plava ;
}
Da bismo pristupili datoteci lista stilova koja sadrži svojstva stila za naslov i tijelo
, moramo jednostavno dodati pravilo @import u bilo koju CSS datoteku gdje je stil potreban.
Dodavanjem samo jednostavnog pravila @import implementirat će se sva svojstva stila na sučelje web stranice bez potrebe za zasebnim upisivanjem svojstava na svakoj web stranici.
Dakle, potrebno je napisati pravilo @import kao:
@uvoz 'stylesheet.css' ;Dodavanje pravila @import pisanjem ' url ” i naziv CSS datoteke u okruglim zagradama također će prikazati iste rezultate:
@uvoz url ( stylesheet.css ) ;Svojstva definirana u ' stilski list ' implementiraju se samo dodavanjem jednostavnog ' @uvoz ” pravilo za to:
Ovo je najlakši način za uključivanje CSS svojstava u datoteku bez dodatnih napora.
Prednosti pravila @import u CSS-u
Pravilo @import obično se koristi iz sljedećih razloga:
- Korištenje pravila @import smanjuje vrijeme i trud programera jer implementira sva svojstva određenog stilskog lista samo pisanjem naziva tog lista nakon @import.
- U velikim i složenim web-aplikacijama pravilo @import pokazalo se vrlo korisnim budući da se ista svojstva stila mogu implementirati u više datoteka samo dodavanjem naziva datoteke lista stilova.
- Elementi lista stilova kao što su zaglavlja, podnožja, tijelo itd. mogu se pohraniti u zasebne datoteke lista stilova, a zatim pomoću pravila @import može se uvesti bilo koji od potrebnih stilova bez potrebe za dodavanjem, uklanjanjem ili komentiranjem svojstava stila iz datoteka.
Ovo sažima upotrebu pravila @import i objašnjava kako se ovo pravilo smatra najboljom metodom za uključivanje CSS-a.
Zaključak
Listu stilova CSS-a može se uvesti ili joj se može pristupiti izravno iz druge tablice stilova, a sva svojstva u uvezenoj tablici stilova izravno su implementirana na web-stranici datoteke u koju je uvezena. Nema potrebe pisati svako CSS svojstvo zasebno za svako sučelje web stranice. Sve što je potrebno je dodati naziv datoteke CSS style sheet s @import. I ovo se smatra najboljom metodom za dodavanje CSS-a.