Ako pripojiť písma CSS: inštrukcie

Ak ste dizajnér alebo správca webových stránok, s najväčšou pravdepodobnosťou budete vedieť, ako spájať písma CSS. Ak ste vlastníkom malého blogu a rozhodli ste sa ozdobiť svoj zdroj a urobiť ho jedinečným, potom vám tieto poznatky pomôžu. Ale je lepšie začať od začiatku, pochopiť, aké kaskádové štýly sú, kde získať písma a kde ich nainštalovať.

Opis

Takže odpoveď na pripojenie písma CSS na stránky musí začínať popisom priamo formálneho jazyka. CSS je kaskádový štýl štýlu. Tento jazyk sa používa ako opis vzhľadu dokumentu. Funguje pri párovaní s značkovacím jazykom.



CSS pracuje na označovaní vizuálnych funkcií stránok na internete. Tie by mali byť vytvorené na základe špeciálnych značkovacích jazykov HTML alebo XHTML.

Použitie

Kto potrebuje CSS? Pre webmasterov, programátorov, ktorí pracujú na vytváraní webu, je potrebné pripojiť písma, nastaviť farby, bloky miest a ďalšie. Hlavnou úlohou kaskádových štýlov je vizuálne rozdeľovať štruktúrovanie. To znamená, že ak HTML tvorí pevný blok textu, CSS pomáha podmienene "zdobiť" tento blok, zvýrazniť prvky a priradiť možnosti. Separácia poskytuje dokument prístupnosť, väčšiu flexibilitu a kontrolu. Umožňuje vám zbaviť sa zložitých a opakujúcich sa obsahových prvkov.

Pripojenie

Pred pochopením, ako správne pripojiť písma k CSS, musíte zistiť, ako kaskádové štýlysynchronizovať so súborom. Pravidlá sú implementované v tom istom jazyku. Samotný štýl získal pravidlá CSS, ktoré používa. Tabuľky môžu byť umiestnené v vizuálne upravenom dokumente, ako aj v samostatnom súbore s príponou .css. V tomto súbore sa zvyčajne nachádzajú len príkazy a poznámky.



Je jasné, že štýl štýlu je možné pripojiť viacerými spôsobmi. Pozrime ich ďalej.

Metódy

K dispozícii sú štyri možnosti, ktoré pomáhajú pripojiť fonty, CSS, priradiť odtieň identifikovať bloky a tak ďalej. D. Ako už bolo spomenuté, môže byť súbor napísaný v HTML súbor pravidiel. Ale tento dizajn nemá rád veľa dizajnérov. Je to spôsobené tým, že zatiaľ čo tímy na celom plátne ťažké opísať parametre a udržať to všetko. Je to oveľa jednoduchšie priradiť štýly do samostatného dokumentu. Ak sú CSS umiestnené samostatne, sú pripojené pomocou značky. Musí byť umiestnený vo vnútri a. V tejto značke musíte zadať atribút href, ktorý zobrazí adresu v súbore CSS. Ak sa tím znovu zhromažďujú v samostatnom súbore, pripojte ich do webového dokumentu pomocou návodu @import. Je potrebné písať medzi značkami. Ihneď po. A štvrtá metóda zahŕňa umiestnenie pravidiel na základe jednej z tagov prostredníctvom atribútu štýlu. Potom pravidlá ovplyvnia samostatný parameter, ktorý je v určitom texte.

Prvé dve metódy označil vznik externých štýlov, a druhý - vnútri.

Fonty

Prečo fonty všeobecne používajú? Samozrejme, každýmajiteľ stránky chce, aby zdroj vyzeral nielen krásne, ale aj jedinečný. Chcel by som umiestniť na stránky špeciálne položky, ktoré by mohli byť pridelené medzi všetky. Tiež si často všimnete záhlavie menu alebo neštandardné hláskovanie. Existuje veľa otázok o tomto. Možno webmasteri použili obrázok zobrazený vo Photoshope. Možno táto verzia prišla s aplikáciou Flash. K dispozícii je variant, ktorý používa javascript. Prax však ukazuje, že prvá možnosť je nepríjemná a pomalá, druhá je zastaraná a tretia je príliš zmrznutá. Ak chcete vytvoriť niečo nové a krásne, môžete sa pokúsiť pripojiť písma CSS.

Vlastnosti

Stojí za to pochopiť, že v našom prípade sú písma nielen určitým štýlom, ale aj súborom vlastností, ktoré sú potrebné na kontrolu vzhľadu textu. Existuje niekoľko možností použitia. Priraďte konkrétne písmo pre hlavičku, odsek, citát, hlavný text, menu atď.
Napriek skutočnosti, že používateľovi je k dispozícii veľké množstvo písiem, veľkostí, sýt atď., Je dôležité nezabudnúť na čitateľnosť. Najlepšie je vyhnúť sa veľkému nahromadeniu rôznych štýlov. Na stránke bude stačiť dve písma.

Rodiny

Ak chcete mať možnosť vybrať štýly písma, použite rodinu rodín písma. Je ťažké jasne pochopiť, či čitatelia na PC do vášho majetku písmo najvhodnejšie všetky verzie rovnakého typu. V tomto prípade si prehliadač vyberie z nich jeden, ktorý sa nájde v systéme používateľa. V zbierke existuje množstvo hodnôt. Napríklad, priezviskoreprezentovaný názvom rodiny písiem. Hodnota generickej rodiny určuje prvú päť rodinu písma. Rodina štýlu písma je zodpovedná za výber dizajnu. Tento štýl je rovnako zdedený ako ten predchádzajúci. Medzi hodnoty sú zvyčajné alebo naklonené písmo a kurzívou. Štýl font-variant je zodpovedný za malé veľké písmená. Na sýtosť používajte veľkosť písma atď. Môžete priradiť veľkosť a farbu písma.

Neštandardné riešenie

Okrem štandardných fontov sa môžu použiť aj neštandardné riešenia. Obyčajne sú oveľa jedinečnejšie a s najväčšou pravdepodobnosťou ich nezaznamenáte na stránkach konkurentov. Ak to chcete urobiť, nemusíte používať obrázky, javascript a flash. Stačí, aby sme prijali pravidlo @ font-face. Umožňuje používateľovi prevziať externý súbor do dokumentu. Táto metóda vám umožňuje pripojiť písmo CSS OTF a TTF. Ide o špeciálne formáty, ktoré fungujú dobre pre podobné úlohy. Problémy môžu nastať iba v prehliadači Internet Explorer. Napriek tomu, že prvýkrát začal používať písma tretích strán už v roku 1997, teraz kladie drsné požiadavky. Robí veľa na to, aby ste zničili vašu prácu. Často môže komprimovať súbor písma, niekedy ho môže zašifrovať. To je dôvod, prečo existujú všetky druhy khaki.

Formáty

V súčasnosti existuje niekoľko formátov písma, ktoré potrebujete vedieť. V opačnom prípade narazíte na rad nekonzistencií a nekompatibility. Môžete pripojiť písmo CSS TTF. Tento formát je teraz podporovaný všetkými prehliadačmi. Výnimkou môže byť Internet Explorer 8 a nižšia, rovnako ako Opera Mini 5.0-8.0.
S EOT môžepracovať len IE Situácia s WOFF je rovnaká ako pri TTF. Program SVG však funguje v prehliadačoch Chrome až do verzie 37, ako aj vo formátoch Safari, iOS Safari a Mozilla. Ako ukazuje prax, je najlepšie použiť TTF. Ide o najuniverzálnejšiu možnosť, ktorá zriedka spôsobuje problémy. Je to najčastejšie.

Pravidlo

Ak chcete pripojiť písmo jedného z vyššie uvedených formátov, stačí použiť pravidlo @ font-face, o ktorom sme hovorili skôr. Aby ste boli jasní, musíte prejsť určitým algoritmom. Máte súbor font.ttf. Ak ho chcete použiť pre hlavný text, najprv musíte skopírovať súbor do priečinka, kde sa nachádzajú všetky súbory na webe. Ak chcete použiť viac ako jedno písmo, môžete tu vytvoriť špeciálny priečinok, ktorý si môžete stiahnuť. Bude to pre vás oveľa jednoduchšie nájsť a zmeniť obsah takejto zložky. Teraz sa musíte uistiť, že samotný prehliadač si stiahol naše písmo. Ak to chcete urobiť, povedzte mu. Používame smernicu @ font-face. Príkaz bude vyzerať takto: @ font-face {font-family: MyUniqueFont; src: url ('fonty /font.ttf'); } Príkaz font-family je zodpovedný za zadanie názvu písma a po jeho použití v štýle štýlov. Druhý riadok obsahuje informácie o ceste, ktorú musí prehliadač nájsť a pripojiť. Toto nie je univerzálna adresa. V závislosti od toho, kam umiestnite súbor do písma, bude táto cesta tiež iná. Týmto spôsobom sa naučíte pripojiť písmo CSS zo zložky.

Pripojenie

Ak neviete, ako pripojiť viac písiem CSS, je na tomto účte aj príručka. Ona jeumožňuje zadať viacero súborov naraz. Napríklad, môžu byť spojené s tuctom. Ak to chcete urobiť, musíte použiť vyššie uvedené pravidlo @ font-face. Ako príklad toho, ako ste predtým pripojili súbor zo zložky, rovnako ako nový riadok, zadajte odkaz na iné nastavenia písma. Ak máte stránky postavené na aplikácii WordPress, pripojenie štýlov je ešte jednoduchšie. Keď potrebujete nahradiť hlavičku písma, prejdite na panel administrátora. Nájdete tu možnosť "Téma". V časti "Tlačiareň" sa nachádza celý rad rôznych variantov. Stačí len vybrať a uložiť zmeny.

Ďalšie možnosti

Písmo písma Google používajú veľmi často písma. Toto je obľúbený nástroj na výber a pripojenie štýlov. Existuje obrovský počet typov písma. Ak ich chcete pripojiť, prejdite na oficiálnu stránku. Zobrazí sa zoznam s príkladmi a príležitosťou na experiment. Po pridaní požadovaného štýlu nezabudnite vybrať cyriliku, ak je váš zdroj v ruštine. Potom si môžete vybrať veľkosť, kresbu alebo vybrať niekoľko možností pre všetky príležitosti hneď.
Potom budete mať hotový kód, ktorý chcete nainštalovať súbor CSS. V tomto prípade funguje aj pravidlo pridávania metód. Napríklad, ak je list štýlu samostatným dokumentom, posielame príkaz na prvý riadok. Ak je štýl listu umiestnený priamo v súbore HTML, musíte ho pridať do značky.

Závery

Pridať nové fonty na vaše stránkyje to jednoduché. Je dôležité okamžite určiť metódy a možnosti. V závislosti od toho, ktorý systém sa vaše stránky nachádzajú, je potrebné premyslieť tieto kroky. Ak máte písomný zdroj, v tomto prípade je málo možností. Ak napríklad WordPress, táto operácia je oveľa jednoduchšia, ako sa môže zdať.

Súvisiace publikácie