Kako povezati pisave CSS: navodila

Če ste oblikovalec ali spletni skrbnik, potem najverjetneje veste, kako povezati pisave CSS. Če ste lastnik majhnega spletnega dnevnika in se odločite, da boste okrasili svoj vir in ga naredili edinstveno, vam mora to znanje pomagati. Ampak bolje je začeti že od samega začetka, da bi razumeli, kakšni kaskadni slogovi so, kje dobiti pisave in kje jih namestiti.

Opis

Torej odgovor na povezavo pisave CSS s spletnim mestom se mora začeti z opisom neposredno formalnega jezika. CSS je kaskadni slogovni list. Ta jezik se uporablja kot opis videza dokumenta. Deluje v povezavi z označevalnim jezikom.

CSS deluje tako, da opozarja na vizualne značilnosti strani na internetu. Slednje je treba ustvariti na podlagi posebnih označevalnih jezikov HTML ali XHTML.

Uporabi

Kdo potrebuje CSS? Povežite pisave, nastavite barve, uredite bloke in tako naprej za spletne skrbnike, programerje, ki delajo na ustvarjanju spletnega mesta. Glavna naloga kaskadnih listov slogov je vizualno razdeliti strukturiranje. To pomeni, da če HTML oblikuje trdni blok besedila, CSS pomaga pogojno "okrasiti" ta blok, izberite elemente, dodeliti parametre.

Ločitev zagotavlja dokument z dostopnostjo, večjo fleksibilnostjo in sposobnostjo upravljanja. Omogoča vam, da se znebil kompleksnih in ponovljivih vsebinskih elementov.

Povezovanje

Preden boste razumeli, kako pravilno povezati pisave s CSS, morate razumeti, kako se kaskadni listi slogov sinhronizirajo z datoteko. Njihova pravila se izvajajo v istem jeziku. Slog je sam dobil pravila CSS, ki jih uporablja. Tabele so lahko v vizualno urejenem dokumentu ali v ločeni datoteki z razširitvijo. Css. V taki datoteki se navadno nahajajo samo ukazi in opombe, ki jim pripadajo.

Tako postane jasno, da lahko povežete sloge na več načinov. Razmislite še naprej.

Metode

Obstajajo štiri možnosti, ki bodo pomagale pri povezovanju pisav CSS, dodeljevanju odtenka, prepoznavanju blokov itd. Kot je že omenjeno, je lahko pravilnik v datoteki, napisani v HTML-ju. Toda to možnost ni všeč mnogi oblikovalci. To je posledica dejstva, da je v celotnem platnu ekip težko najti opisne parametre in vse to spoštovati. Vlogi je veliko lažje dodeliti v ločenem dokumentu.

Če so CSS locirani, so povezani prek oznake . Postaviti ga mora v notranjost in . V tej znamki morate določiti atribut href, ki bo naslov v datoteki prikazal s CSS.

Če ukaze ponovno zbere ločena datoteka, jih povezujemo s spletnim dokumentom, tako da navedemo @import. Napisati mora biti med oznakami. Takoj po

Naslednji dve metodi se nanašata na situacijo, v kateri je CSS postavljen neposredno v dokument, ki ga želite "okrasiti". Ta slog tabele je lahko med oznakami. In četrti način vključuje postavljanje pravil na podlagi ene od oznak, s pomočjo atributa sloga. Nato bodo pravila vplivala na ločen parameter, ki je v mejah določenega besedila.

Prvi dve metodi sta zaznamovali videz zunanjih slogov, drugi pa notranji.

Pisave

Zakaj uporabljati pisave na splošno? Vsak lastnik spletnega mesta seveda želi, da bi njegov vir izgledal ne samo lepo, ampak tudi edinstveno. Želim postaviti na strani posebnih elementov, ki bi se lahko izkazali med vsemi. Prav tako pogosto opazite naslove ali meni nestandardnega črkovanja.

O tem je veliko vprašanj. Morda so spletni skrbniki uporabili sliko v Photoshopu. Mogoče je bilo tako pri Flashu. Obstaja možnost, ki uporablja jаvascript. Toda, kot kaže praksa, prva možnost je neudobna in počasna, druga je zastarela, tretja pa je preveč zamorochenny. Če želite ustvariti nekaj novega in lepega, lahko poskusite povezati pisave CSS.

Lastnosti

Pomembno je razumeti, da v našem primeru pisave niso le določen slog, temveč tudi niz številnih lastnosti, ki so potrebne za nadzor zunanjega vrsta besedila. Uporabite lahko več možnosti. Določite določeno pisavo za naslov, odstavek, citat, besedilo telesa, meni in tako naprej.

Kljub dejstvu, da je uporabnik na voljo veliko različnih sledi, velikosti, nasičenosti itd, je pomembno, da ne pozabite na berljivost. Bolje je, da se izognemo veliki kup različnih stilov. Dovolj bo, da na strani najdete dve pisavi.

Družine

Če želite izbrati slog pisave, uporabite družino font-family. Zelo težko je nedvoumno razumeti, ali je na računalniku bralnika vašega vira določena pisava, je bolje vnesti vse iste vrste različic. V tem primeru bo spletni brskalnik izbral tisto, ki se nahaja v uporabniškem sistemu.

Ta družina ima več pomenov. Na primer, družinsko ime predstavlja ime družine pisav. Vrednost generične družine določa pet najboljših družin pisav.

Družina font-style je odgovorna za izbiro pisave. Ta slog je tudi podedovan, kot prejšnji. Med pomeni je običajen ali poševen oris in poševno. Stolpec-variantni slog je odgovoren za majhne velike črke. Za zasičenost uporabite pisavo-težo itd. Pisavi lahko dodelite velikost in barvo.

Nestandardna rešitev

Poleg standardnih pisav lahko uporabite nestandardne rešitve. Ponavadi so bolj edinstveni in verjetno jih ne boste opazili na spletnih mestih konkurentov. Za to vam ni treba uporabljati slik, jаvascript in flash. Dovolj je, da vzamete pravilo @ font-face. Uporabniku omogoča, da v dokument prenese zunanjo datoteko.

Ta metoda vam omogoča povezavo pisave CSS OTF in TTF. To so posebne oblike, ki dobro delujejo s podobnimi nalogami. Težave se lahko pojavijo samo pri brskalniku Internet Explorer. Kljub temu, da je leta 1997 prvič začel uporabljati pisave tretjih oseb, zdaj postavlja stroge zahteve.

Veliko naredi za uničenje vašega dela. Pogosto lahko stisne datoteko pisave, včasih pa je lahko šifrirana. Zato obstajajo vse vrste hacks.

Oblike

Zdaj obstaja več formatov pisav, ki jih morate poznati. V nasprotnem primeru boste naleteli na številne nedoslednosti in nezdružljivosti. Pisavo CSS TTF lahko povežete. Ta format zdaj podpirajo vsi spletni brskalniki. Izjema je lahko različica brskalnika Internet Explorer 8 in novejša različica, kot tudi Opera Mini 5.0-8.0.

Z EOT lahko deluje samo IE. Položaj z WOFF je enak kot pri TTF. Toda SVG deluje v brskalnikih Chrome do 37 različic, pa tudi Safari, iOS Safari, brskalnik Android. Kot kaže praksa, je najbolje uporabiti TTF. To je najbolj univerzalna možnost, ki redko povzroča težave. Najpogostejši je.

Pravilo

Torej, če želite povezati pisavo ene od zgornjih formatov, je dovolj, da uporabite pravilo @ font-face, ki smo ga omenili prej. Če želite biti jasni, morate upoštevati določen algoritem. Imate pisavo font.ttf. Če ga želite uporabiti za glavno besedilo, morate najprej kopirati datoteko v mapo, v kateri so vse datoteke spletnega mesta.

Če želite uporabiti več kot eno pisavo, lahko ustvarite posebno mapo za prenos. Zato je veliko lažje, da jih najdete in spremenite vsebino takšne mape.

Zdaj moramo zagotoviti, da brskalnik samodejno naloži našo pisavo. Če želite to narediti, mu morate dati navodila. Uporabljamo direktivo @ font-face. Naša ekipa bo videti tako:

@ font-face {

font-family: MyUniqueFont;

src: url (`pisave / font.ttf`);

}

Ukaz font-family je odgovoren za pisavo, da dobi svoje ime in potem, ko ga lahko uporabite pri pisanju sloga. V drugi vrstici je prikaz poti, po kateri mora brskalnik najti slog in ga povezati. To ni univerzalni naslov. Odvisno od tega, kje je datoteka pisave, se ta način razlikuje. Tako boste izvedeli, kako povezati pisavo CSS iz mape.

Povezave

Če ne veste, kako povezati več pisav CSS, je tudi to navodilo. Omogoča vam, da določite več datotek hkrati. Na primer, jih je mogoče povezati iz ducata. Če želite to narediti, morate uporabiti zgornjo @ font-face pravilo. Na primer, kako ste prej povezali eno datoteko iz mape, na enak način iz nove vrstice določite povezave do drugih različic pisav.

Če je vaše spletno mesto zgrajeno na osnovi WordPressa, je povezovanje stilov še lažje. Ko boste morali zamenjati oris naslova, se preprosto prijavite v skrbniško ploščo. Tam poiščite »Nastavitve teme«. V razdelku »Tipografija« bo prikazan celoten seznam različnih možnosti. Samo izbrati in shraniti morate spremembo.

Druge možnosti

Zelo pogosto za povezavo pisav uporabljate storitev Google Fonts. To je priljubljeno orodje za izbiro in povezovanje stilov. Obstaja veliko število nizov pisav. Če jih želite povezati, pojdite na uradno spletno mesto.

Preden boste imeli celoten seznam primerov in priložnost za eksperimentiranje. Ko dodate želeni slog, ne pozabite izbrati cirilice, če je vaš vir v ruskem jeziku. Nato lahko izberete velikost, slog ali pa več možnosti za vse priložnosti.

Ko je koda pripravljena za namestitev v datoteko CSS. V tem primeru velja tudi pravilo dodajanja. Na primer, če slogovne liste predstavlja ločen dokument, se ukaz pošlje v prvo vrstico. Če so slogovne datoteke, ki jih imate, neposredno v datoteki HTML, jih morate dodati v telo oznak.

Sklepi

Dodajanje novih pisav na vašo spletno stran ni težko. Pomembno je nemudoma odločiti z metodami in možnostmi. Odvisno od tega, na kakšen sistem je vaše spletno mesto vključeno, morate razmisliti o teh ukrepih. Če imate samo objavljen vir, ni veliko možnosti. Če na primer na WordPressu, potem je ta operacija veliko lažja, kot se morda zdi.