Если вы дизайнер или веб-мастер, то, скорее vain osata sisällyttää CSS-fontit. Jos olet pienen blogin omistaja ja päätit koristaa resurssiasi ja tehdä siitä ainutlaatuisen, tämän tiedon pitäisi auttaa sinua. Mutta on parempi, kun aloitat alusta, ymmärtää, mitä CSS-tyylisivut ovat, mistä saat fontteja ja missä ne voidaan asentaa.
Joten vastaus CSS-fontin yhdistämiseensivuston on aloitettava itse virallisen kielen kuvauksella. CSS on CSS-tyylitaulukko. Tätä kieltä käytetään kuvaamaan asiakirjan ulkonäköä. Se toimii yhdessä merkintäkielen kanssa.
CSS osoittaa verkkosivujen visuaaliset ominaisuudet. Jälkimmäinen tulisi luoda erityisten merkintäkielien HTML tai XHTML perusteella.
Kenelle CSS on tarkoitettu?On välttämätöntä yhdistää fontit, asettaa värejä, järjestää lohkot ja niin edelleen verkkovastaaville, ohjelmoijille, jotka työskentelevät sivuston luomisen parissa. CSS-tyylitaulukoiden päätarkoitus on visuaalisesti erottaa rakenne. Toisin sanoen, jos HTML muodostaa kiinteän tekstilohkon, CSS auttaa ehdollisesti "koristelemaan" tätä lohkoa, korostamaan elementtejä ja määrittämään parametreja.
Erottelu antaa asiakirjalle esteettömyyden, lisää joustavuutta ja hallittavuutta. Poistaa monimutkaiset ja toistuvat sisältöelementit.
Ennen kuin selvität, kuinka yhdistää oikeinfontteja CSS: ssä, sinun on ymmärrettävä, kuinka CSS-tyylitaulukot synkronoidaan tiedoston kanssa. Niiden säännöt pannaan täytäntöön samalla nimellä. Itse tyylitaulukossa on nyt CSS-säännöt, joita se käyttää. Taulukot voivat sijaita sekä visuaalisesti muokatussa asiakirjassa että erillisessä tiedostossa .css-laajennuksella. Tällainen tiedosto sisältää yleensä vain komentoja ja huomautuksia niihin.
Joten käy selväksi, että tyylitaulukot voidaan sisällyttää useilla tavoilla. Tarkastellaan heitä edelleen.
Apua on neljäyhdistää CSS-kirjasimia, varjoa, määrittelee lohkoja jne. Kuten aiemmin mainittiin, joukko sääntöjä voi olla HTML-muodossa kirjoitetussa tiedostossa. Mutta monet vaihtoehdot eivät pidä tästä vaihtoehdosta. Tämä johtuu siitä, että koko komentoruudussa on vaikea löytää kuvaavia parametreja ja hallita tätä kaikkea. Tyylien määrittäminen erilliseen asiakirjaan on paljon helpompaa.
Jos CSS sijaitsee erikseen, ne sisällytetään <link> -tagin kautta. Se on sijoitettava <head> ja </head> sisään. Tässä merkinnässä sinun on määritettävä href-attribuutti, joka näyttää osoitteen tiedostolle CSS: n avulla.
Jos komennot kootaan uudelleen erilliseen tiedostoon,yhdistämme ne verkkodokumenttiin @importin kautta. Se on kirjoitettava merkkien <style> ja </style> väliin. Välittömästi <tyyli> -kohdan jälkeen sijoitamme direktiivin ja suluissa osoitamme URL-osoitteen jälkeen linkin tiedostoon CSS: llä. Molemmissa tapauksissa sääntöjä sovelletaan koko asiakirjaan.
Seuraavat kaksi menetelmää liittyvät tilanteeseenkun CSS sijoitetaan suoraan koristeltavaan asiakirjaan. Tyylitaulukko voi tässä tapauksessa olla merkkien <style> ja </style> välissä. Ja neljänteen menetelmään sisältyy sääntöjen sijoittaminen yhden tagin alareunaan tyylimääritteen avulla. Sitten säännöt vaikuttavat erilliseen parametriin, joka on tietyn tekstin rajoissa.
Kaksi ensimmäistä menetelmää ohjasivat ulkoisia tyylitaulukoita, kun taas toisessa esiteltiin sisäisiä tyylitaulukoita.
Mihin fontteja käytetään?Tietenkin jokainen sivuston omistaja haluaa resurssinsa näyttävän paitsi kauniilta myös ainutlaatuisilta. Haluaisin sijoittaa sivuille erityisiä elementtejä, jotka voisivat erottua muista. Lisäksi näet usein otsikoita tai valikoita epätyypillisissä kirjoitusasuissa.
Tästä on paljon kysymyksiä.Ehkä verkkovastaavat käyttivät Photoshopissa piirrettyä kuvaa. Ehkä tämä vaihtoehto ilmestyi Flashin ansiosta. On vaihtoehto, että he käyttivät Javascriptia. Mutta kuten käytäntö osoittaa, ensimmäinen vaihtoehto on hankala ja hidas, toinen on vanhentunut ja kolmas on liian hämmentynyt. Voit luoda jotain uutta ja kaunista yrittämällä lisätä CSS-fontteja.
On ymmärrettävä, että tapauksessamme fontit ovattietyn tyylin lisäksi joukko ominaisuuksia, joita tarvitaan tekstin ulkonäön hallitsemiseksi. Voit käyttää useita vaihtoehtoja. Määritä tietty fontti otsikolle, kappaleelle, lainaukselle, tekstille, valikkoon ja muuhun.
Huolimatta siitä, että käyttäjällä on pääsy valtavaanErilaisia tyylejä, kokoja, painoja jne., on tärkeää unohtaa luettavuus. Parempi välttää paljon erilaisia tyylejä. Kaksi fonttia sivulla riittää.
Voit valita tyylinfontti käyttää font-family-ohjelmaa. On hyvin vaikea ymmärtää yksiselitteisesti, onko resurssisi lukijan tietokoneessa tietty fontti; on parempi antaa kaikki saman tyyppiset vaihtoehdot. Tässä tapauksessa verkkoselain valitsee niistä käyttäjän selaimen.
Tällä perheellä on useita merkityksiä. Esimerkiksi sukunimeä edustaa kirjasinperheen nimi. Yleisperhe-arvo määrittelee viisi suurinta kirjasinperhettä.
Kirjasintyyliperhe vastaa tyylin valinnasta.Tämä tyyli on peritty samoin kuin edellinen. Merkitykset sisältävät säännöllisen tai kursivoidun ja kursivoidun. Fontti-variantti-tyyli on vastuussa pienistä korkkeista. Käytä kylläisyyttä varten font-weight ja niin edelleen. Fontille voidaan määrittää koko ja väri.
Tavallisten fonttien lisäksi voit käyttääepätyypilliset ratkaisut. Ne ovat yleensä ainutlaatuisempia ja todennäköisesti et huomaa niitä kilpailijoiden sivustoissa. Sinun ei tarvitse käyttää kuvia, javascriptiä ja salamaa. Riittää, että otat @ font-face-säännön. Sen avulla käyttäjä voi ladata ulkoisen tiedoston asiakirjaan.
Tämä menetelmä mahdollistaa CSS-fontin yhdistämisenOTF ja TTF. Nämä ovat erityisiä muotoja, jotka tekevät melko hyvää työtä. Ongelmia voi esiintyä vain Internet Explorer -selaimessa. Vaikka hän aloitti kolmannen osapuolen kirjasinten käytön vuonna 1997, hänellä on nyt tiukat vaatimukset.
Hän tekee paljon pilatakseen työsi. Se voi usein pakata tiedoston kirjasimella, joskus myös salata sen. Siksi tapahtuu kaikenlaisia hakkereita.
Nyt on olemassa useita fonttiformaattejatarvitsee tietää. Muussa tapauksessa kohtaat useita epäjohdonmukaisuuksia ja yhteensopimattomuuksia. Voit yhdistää CSS TTF -fontin. Tätä muotoa tukevat nyt kaikki verkkoselaimet. Poikkeuksena voi olla Internet Explorer -versio 8 ja sitä uudemmat versiot sekä Opera Mini 5.0-8.0.
Vain IE voi työskennellä EOT: n kanssa.Tilanne WOFF: n kanssa on sama kuin TTF: n kanssa. Mutta SVG toimii Chrome-selaimissa versioon 37 asti, samoin kuin Safari, iOS Safari, Android Browser. Kuten käytäntö osoittaa, on parasta käyttää TTF: ää. Tämä on monipuolisin vaihtoehto ja aiheuttaa harvoin ongelmia. Se on yleisin.
Joten, yhdistää yhden fontinyllä olevista muodoista, käytä vain @ font-face -sääntöä, josta puhuimme aiemmin. Jotta se olisi selvä, sinun on noudatettava tiettyä algoritmia. Sinulla on kirjasintiedosto nimeltä font.ttf. Jos haluat käyttää sitä päätekstinä, sinun on ensin kopioitava itse tiedosto kansioon, jossa kaikki sivustotiedostot sijaitsevat.
Jos haluat käyttää useampaa kuin yhtä kirjasinta, voit luoda tähän erityisen kansion, johon lataat ne. Tämä helpottaa niiden löytämistä ja tällaisen kansion sisällön muuttamista paljon helpommin.
Nyt meidän on saatettava selain lataamaan fonttimme itsestään. Tätä varten sinun on annettava hänelle ohjeet. Käytämme @ font-face -direktiiviä. Komentomme näyttää tältä:
@ font-face {
font-family: MyUniqueFont;
src: url ("fontit / font.ttf");
}
Font-family -komento on vastuussa fontin varmistamisestasai nimensä ja sen jälkeen sitä voitiin käyttää tyylin kirjoittamiseen. Toinen rivi sisältää polun, josta selaimen tulisi löytää tyyli ja yhdistää se. Tämä ei ole yleinen osoite. Tämä polku on erilainen sen mukaan, mihin sijoitit fonttitiedoston. Tämä näyttää, kuinka CSS-fontti lisätään kansioon.
Jos et tiedä kuinka yhdistää useitaCSS-fontit, tästä on myös ohje. Sen avulla voit määrittää useita tiedostoja kerralla. Voit esimerkiksi liittää kymmenkunta niistä. Tätä varten sinun on käytettävä jo yllä olevaa @ font-face -sääntöä. Seuraamalla esimerkkiä siitä, kuinka olet aiemmin yhdistänyt yhden tiedoston kansiosta samalla tavalla uudelta riviltä, ilmoita linkit muihin kirjasinvaihtoehtoihin.
Jos sinulla on WordPress-sivusto,tyylien yhdistäminen on vieläkin helpompaa. Kun haluat muuttaa otsikkotyyliä, sinun on vain kirjauduttava hallintapaneeliin. Etsi sieltä "Teeman asetukset". "Typografia" -osiossa on koko luettelo eri vaihtoehdoista. Sinun tarvitsee vain valita ja tallentaa muutos.
Hyvin usein fonttien yhdistämiseen he käyttävätGoogle Fonts -palvelu. Se on suosittu työkalu tyylien valitsemiseen ja yhdistämiseen. Täällä on paljon fonttijoukkoja. Yhdistä ne vain siirtymällä viralliselle verkkosivustolle.
Näet kokonaisen luettelon, jossa on esimerkkejä jamahdollisuus kokeilla. Kun olet lisännyt haluamasi tyylin, älä unohda valita kyrillisiä aakkosia, jos resurssisi on venäjä. Sitten voit valita koon, tyylin tai valita heti useita vaihtoehtoja kaikkiin tilanteisiin.
Sen jälkeen olet valmis tarvitsemasi koodin.asetettu CSS-tiedostoon. Tässä tapauksessa sovelletaan myös menetelmien lisäämisen sääntöä. Esimerkiksi, jos tyylitaulukot esitetään erillisessä asiakirjassa, lähetämme komennon ensimmäiselle riville. Jos sinulla on tyylitaulukoita suoraan HTML-tiedostossa, sinun on lisättävä ne <style> - ja </style> -tunnisteiden runkoon.
Uusia fontteja on helppo lisätä verkkosivustoosi.On tärkeää päättää välittömästi menetelmistä ja vaihtoehdoista. Sivustosi käyttöjärjestelmän mukaan sinun on harkittava nämä toimet. Jos sinulla on itse kirjoittama resurssi, tässä tapauksessa on vain vähän vaihtoehtoja. Jos esimerkiksi WordPressissä tämä toiminto on paljon helpompaa kuin se saattaa tuntua.
