Ero @importin ja CSS-tiedostojen linkin välillä

Eri sivustot sisältävät niiden ulkoisen CSS-tyyliarkit eri tavoin - joko käyttämällä @import-lähestymistapaa tai linkittämällä kyseiseen CSS-tiedostoon. Mitä eroa on @importin ja CSS-linkin välillä, ja miten päätit, mikä on sinulle parempi?

Ero @importin ja Linkin välillä

Linkittäminen on ensimmäinen tapa sisällyttää ulkoinen tyylitaulukko verkkosivuillesi. Sen on tarkoitus linkittää sivusi tyylisivullesi. Se lisätään päätäsi HTML-asiakirja.

Tuonnin avulla voit tuoda yhden tyylisivun toiseen. Tämä on hieman erilainen kuin linkkiskenaario, koska voit tuoda tyylitaulukoita linkitetyn tyylitaulukon sisään.

Standardin näkökulmasta ei ole eroa linkittämisen ulkoiseen tyylisivuun tai sen tuomisen välillä. Kumpikin tapa on oikea ja kumpi tahansa toimii yhtä hyvin useimmissa tapauksissa. On kuitenkin olemassa muutama syy, miksi haluat ehkä käyttää toisiaan.

Miksi käyttää @importia?

Monta vuotta sitten yleisin syy, joka annettiin @importin sijaan (tai sen kanssa), johtuu siitä, että vanhemmat selaimet eivät tunnistaneet @importia, joten voit piilottaa tyylit niistä. Tuomalla tyylisivusi tuodaan ne olennaisesti saataville nykyaikaisemmille, standardeja noudattaville selaimille samalla, kun "piilotat" ne

instagram viewer
vanhemmat selainversiot.

Toinen tapa käyttää @import -menetelmää on käyttää useita tyylitaulukoita sivulla samalla, kun sisällytät vain yhden linkin asiakirjan päähän. Esimerkiksi yrityksellä voi olla yleinen tyylitaulukko jokaiselle sivuston sivulle, ja alaosioilla on ylimääräisiä tyylejä, jotka koskevat vain kyseistä alaosaa. Linkittämällä alaosaston tyylitaulukkoon ja tuomalla yleiset tyylit kyseisen tyylin yläosassa taulukon, sinun ei tarvitse ylläpitää jättimäistä tyylitaulukkoa, jossa on kaikki sivuston tyylit ja kaikki alaosassa. Ainoa vaatimus on, että kaikkien @import-sääntöjen on oltava ennen muita tyylisääntöjäsi. Perintö voi silti olla ongelma.

Miksi käyttää linkkiä?

Syy linkitettyjen tyylitaulukoiden käyttöön on tarjota vaihtoehtoisia tyylitaulukoita asiakkaillesi. Selaimet, kuten Firefox, Safari ja Opera, tukevat rel = "vaihtoehtoinen tyylitaulukko" -attribuuttia, ja kun sellainen on käytettävissä, katsojat voivat vaihtaa niiden välillä. Voit myös vaihtaa tyylisivun välillä IE: ssä - useimmiten käytetyn kanssa - JavaScript-vaihtajan avulla Zoom-asettelut esteettömyystarkoituksiin.

Yksi @importin käytön haittapuolista on, että jos sinulla on hyvin yksinkertainen pää, jossa on vain @import -sääntö, sivuillasi saattaa näkyä "tyylittömän sisällön salama" ladattaessa. Yksinkertainen korjaus tähän on varmistaa, että sinulla on ainakin yksi ylimääräinen linkki tai komentosarjaelementti päässäsi.

Entä mediatyyppi?

Monet kirjailijat väittävät, että mediatyypin avulla voit piilottaa tyylitaulukot vanhemmilta selaimilta. Usein he mainitsevat tämän idean eduksi joko @import tai, mutta voit asettaa median kirjoita jommallakummalla menetelmällä, ja vanhemmat selaimet, jotka eivät tue mediatyyppejä, eivät näe niitä kummassakaan tapauksessa.

Joten mitä menetelmää sinun pitäisi käyttää?

Useimmat kehittäjät käyttävät nykyään linkki- ja tuontityyliarkkeja ulkoisiin tyylilehtiin. Tällä tavalla sinulla on vain yksi tai kaksi koodiriviä muokattavaksi HTML-asiakirjoissasi. Mutta viimeinen asia on, että se on sinun tehtäväsi. Jos olet mukavampi @importin kanssa, jatka sitä! Molemmat menetelmät ovat standardien mukaisia, ja ellet aio tukea todella vanhoja selaimia, kummankaan käyttöön ei ole vahvaa syytä.