Tačiau koduojant sunku įtraukti tas pačias CSS ypatybes kiekvienam tinklalapiui atskirai. Taigi, reikia naudoti sprendimą, per kurį būtų galima sukurti vieną stiliaus lapą ir lengvai pasiekti kelis failus.
Kas yra @import taisyklė CSS?
Geriausias būdas įtraukti CSS stiliaus ypatybes yra naudoti @import taisyklę. @import naudojamas importuoti arba pasiekti CSS stiliaus lapą iš kito stiliaus lapo. Tai sumažina kūrėjo pastangas, nes visos į importuotą stiliaus lapą įtrauktos ypatybės įdiegiamos tiesiogiai, tiesiog parašant @import ir tikslų stiliaus lapo pavadinimą.
@import taisyklės sintaksė
Sintaksė, skirta pridėti @import taisyklę, norint pasiekti stiliaus lapą iš kito stiliaus lapo, yra tokia:
@importuoti 'stylesheetname.css' ;
@import taisyklė taip pat gali būti pridėta tokiu būdu:
@importuoti url ( stiliaus lentelės pavadinimas.css ) ;
Tiesiog pridėkite CSS stiliaus lapo failo pavadinimą atvirkštiniais kableliais arba apvaliuose skliaustuose su „ url 'parašius' @importuoti “.
Pavyzdys: @import taisyklės pridėjimas
Norėdami suprasti, kaip veikia @import taisyklė, parašome paprastą kodo fragmentą:
< h1 > Tai paprastas tekstas! < / h1 >Aukščiau pateiktame kodo fragmente yra antraštė
su paprastu vienos eilutės sakiniu, įtrauktu į HTML dokumentą. Šis paprastas kodas generuos šią išvestį:
Leidžia sukurti stiliaus lentelę, kad apibrėžtų kai kurias CSS ypatybes, kurias vėliau galima importuoti iš failo, per kurį sukuriama aukščiau nurodyta tinklalapio sąsaja. Sukuriame kitą failą ir pavadiname jį ' stiliaus lapas “ su failo tipu, deklaruotu kaip „ css “ ir tiesiog pridėkite keletą ypatybių
antraštei ir turiniui: h1 {
spalva : vidurnakčio mėlyna ;
fono spalva : žydros spalvos ;
teksto lygiavimas : centras ;
}
kūnas {
fono spalva : šviesiai mėlynas ;
}
Norėdami pasiekti stiliaus lapo failą, kuriame yra stiliaus ypatybės
antraštei ir turiniui, turime tiesiog pridėti @import taisyklę bet kuriame CSS faile, kur reikalingas šis stilius.
Pridėjus tik paprastą @import taisyklę, tinklalapio sąsajoje bus įdiegtos visos stiliaus ypatybės, o ypatybių nereikės įvesti atskirai kiekviename tinklalapyje.
Taigi, @import taisyklę reikia parašyti taip:
@importuoti 'stylesheet.css' ;@import taisyklės pridėjimas rašant „ url “ ir CSS failo pavadinimas apvaliuose skliaustuose taip pat parodys tuos pačius rezultatus:
@importuoti url ( stiliaus lapas.css ) ;Savybės, apibrėžtos „ stiliaus lapas “ failas yra įgyvendinamas tiesiog pridedant paprastą “ @importuoti “ taisyklė:
Tai lengviausias būdas įtraukti CSS ypatybes į failą be jokių papildomų pastangų.
@import taisyklės CSS privalumai
@import taisyklė dažniausiai naudojama dėl šių priežasčių:
- Naudojant @import taisyklę sutrumpėja kūrėjo laikas ir pastangos, nes įgyvendinamos visos konkretaus stiliaus lapo ypatybės, tiesiog įrašant to lapo pavadinimą po @import.
- Didelėse ir sudėtingose žiniatinklio programose @import taisyklė yra labai naudinga, nes tas pačias stiliaus ypatybes galima įdiegti keliuose failuose, tiesiog pridedant stiliaus lapo failo pavadinimą.
- Stiliaus lapo elementus, pvz., antraštes, poraštes, turinį ir tt, galima saugoti atskiruose stiliaus lapų failuose, o tada naudojant @import taisyklę galima importuoti bet kurį reikiamą stilių nepridedant, pašalinant ar komentuojant stiliaus ypatybes iš failą.
Tai apibendrina @import taisyklės naudojimą ir paaiškina, kaip ši taisyklė laikoma geriausiu būdu įtraukti CSS.
Išvada
CSS stiliaus lapą galima importuoti arba pasiekti tiesiogiai iš kito stiliaus lapo, o visos importuoto stiliaus lapo ypatybės yra tiesiogiai įdiegtos failo, į kurį jis buvo importuotas, tinklalapyje. Nereikia rašyti kiekvienos CSS nuosavybės atskirai kiekvienai tinklalapio sąsajai. Tereikia pridėti CSS stiliaus lapo failo pavadinimą su @import. Ir tai laikomas geriausiu būdu pridėti CSS.