Sledijo glavne ' pri pravilih « v CSS:
Na kratko razpravljajmo o vsakem od treh ' pri pravilih «, da bi razumeli, kako delujejo.
Kaj je pravilo @import v CSS?
' @uvoz ” pravilo v CSS se uporablja za uvoz slogovnega lista CSS iz drugega slogovnega lista. Če obstaja slogovna tabela CSS, ki vsebuje lastnosti ali navodila za oblikovanje za različne elemente spletne strani, in je treba isti slog dodati v drugo datoteko spletne strani, pri čemer napišete samo » @uvoz « z imenom tega slogovnega lista (ki vsebuje lastnosti CSS) na desni strani v bodisi okroglem oklepaju z » url ” ali v narekovajih lahko uvozi vse lastnosti iz te slogovne tabele in jih uporabi neposredno v slogovni tabeli, kjer je “ @uvoz « je bilo dodano pravilo.
Sintaksa
Ime datoteke s slogovnim listom v formatu CSS mora biti napisano za ' @uvoz ”. Torej, sintaksa za dodajanje ' @uvoz ” Pravilo v slogovnem listu je naslednje:
@uvoz 'stylesheetname.css' ;
Uvozno pravilo lahko za isti namen zapišete tudi kot naslednje, saj bo ustvarilo enak rezultat:
@uvoz url ( stylesheetname.css ) ;Kaj je pravilo @media v CSS?
' @mediji ” Pravilo se uporablja za dodajanje medijskih navodil na spletno stran. To pravilo deluje v skladu s pogojem, uporabljenim med dodajanjem tega pravila. Pogoj je dodan takoj po dodajanju ' @mediji ” na desni strani in nato znotraj pravila v zavitih oklepajih so lastnosti ali navodila, ki jih je treba izvesti, ko je pogoj resničen.
Primer: uporaba pravila @media
Za razumevanje na primeru lahko spletni strani dodamo nekaj vsebine:
< div razred = 'moj razred' >< h1 > Dobrodošli v vadnici LinuxHint! < / h1 >
< / div >
V zgornjem delčku kode je ustvarjen naslov, ki to prikazuje kot vsebino spletne strani.
Vzemimo primer dodajanja medijskih navodil, ko se dimenzije ali širina strani povečajo ali zmanjšajo. Najprej napišite ' @mediji « in nato dodajte pogoj ter nato v zavitih oklepajih definirajte lastnosti CSS, ki naj bodo implementirane, če je pogoj z » @mediji ” postane res:
@mediji ( največja širina : 700 slikovnih pik ) {.moj razred {
barva : Črna ;
ozadje : zelena ;
}
}
@mediji ( najmanjša širina : 700 slikovnih pik ) in ( največja širina : 900 slikovnih pik ) {
.moj razred {
barva : Črna ;
ozadje : rumena ;
}
}
@mediji ( najmanjša širina : 900 slikovnih pik ) {
.moj razred {
barva : Črna ;
ozadje : cian ;
}
}
V zgornji kodi so bile omenjene različne velikosti širine kot pogoj za ustrezno izvajanje treh različnih pravil za medije. Na primer, v skladu z zgornjo kodo, ko bo najmanjša širina 700 slikovnih pik, se bo barva ozadja besedila spremenila v rumeno.
Sledi rezultat, ustvarjen z zgornjo kodo. Spreminjanje velikosti zaslona bo spremenilo barve ozadja besedila:
Kaj je pravilo @font-face v CSS?
Pravilo pisave je preprosta metoda za dodajanje slogov pisave neposredno na spletno stran. S tem pravilom se pisave neposredno prenesejo in uporabijo v besedilu.
Primer: uporaba pravila @font-face
Razumejmo metodo za dodajanje » @font-face ” s preprostim primerom:
< div razred = 'moj razred' >< h1 > Dobrodošli v vadnici LinuxHint! < / h1 >
< / div >
Zgornji delček kode ima enak naslov besedila, kot je opisano v prejšnjem razdelku te objave.
Izvajajmo ' @font-face ' pravilo za ' ” za spremembo pisave:
@font-face {družina pisav : 'DejaVu Sans' ;
src : url ( './fonts/DejaVuSans.ttf' ) format ( 'ttf' ) ;
teža pisave : 500 ;
}
h1 {
družina pisav : 'DejaVu Sans' ;
teža pisave : 500 ;
}
V zgornjem delčku kode je ime zahtevane družine pisav in nato » url ” povezavo, od koder naj bi pisavo prenesli in nato težo pisave. Ko je pisava določena prek » @font-face ' se lahko ime obraza pisave uporablja s katerim koli elementom, kot je bilo v tej kodi uporabljeno za ' h1 ” naslov.
Če zaženete to kodo, boste spremenili pisavo v skladu z navodili, navedenimi v ' @font-face ” pravilo. Naslednji bo rezultat zgornjega delčka kode:
To povzema namen ' @ ” Simbol v CSS.
Zaključek
' @ ' Simbol v CSS se uporablja za dodajanje ' pri pravilih « v CSS. Ta pravila opravljajo zelo uporabne naloge med uporabo CSS za oblikovanje dokumentov, tj. uvozijo celotne slogovne liste iz druge datoteke css prek ' @uvoz ', uporabite lastnosti CSS na definiranem mediju v skladu s pogoji prek ' @mediji ' in neposredno prenesite pisave za uporabo na spletni strani prek ' @font-face ” pravilo.