Jeśli jesteś projektantem lub webmasterem, to raczejpo prostu wiem, jak włączyć czcionki CSS. Jeśli jesteś właścicielem małego bloga i postanowiłeś udekorować swój zasób i uczynić go wyjątkowym, ta wiedza powinna ci pomóc. Ale lepiej zacząć od samego początku, aby zrozumieć, co to są kaskadowe arkusze stylów, gdzie zdobyć czcionki i gdzie je zainstalować.
Więc odpowiedź na pytanie, jak podłączyć czcionkę CSSWitryna musi zaczynać się od opisu samego języka formalnego. CSS to kaskadowy arkusz stylów. Ten język służy jako opis wyglądu dokumentu. Działa w połączeniu z językiem znaczników.
CSS pracuje nad wskazaniem wizualnych funkcji stron w Internecie. Ten ostatni powinien być oparty na specjalnych językach znaczników HTML lub XHTML.
Kto potrzebuje CSS?Łączenie czcionek, ustawianie kolorów, układanie bloków itp. Jest konieczne dla webmasterów, programistów, którzy pracują nad tworzeniem witryny. Głównym zadaniem kaskadowych arkuszy stylów jest wizualne oddzielenie struktury. Oznacza to, że jeśli HTML tworzy solidny blok tekstu, wówczas CSS pomaga warunkowo „ozdobić” ten blok, wyróżnić elementy, przypisać parametry.
Separacja zapewnia dostęp do dokumentów, większą elastyczność i kontrolę. Pozwala pozbyć się złożonych i powtarzalnych elementów treści.
Zanim zrozumiesz, jak się połączyćczcionek w CSS, musisz zrozumieć, w jaki sposób kaskadowe arkusze stylów są synchronizowane z plikiem. Ich reguły są implementowane w języku o tej samej nazwie. Sam arkusz stylów nabył reguły CSS, których używa. Tabele mogą znajdować się w edytowanym wizualnie dokumencie lub w osobnym pliku z rozszerzeniem .css. Taki plik zwykle zawiera tylko polecenia i uwagi.
Staje się więc jasne, że arkusze stylów można łączyć na kilka sposobów. Rozważmy je dalej.
Istnieją cztery opcje pomocy.obejmują czcionki CSS, przypisują odcień, definiują bloki itp. Jak wspomniano wcześniej, zbiór reguł może znajdować się w pliku napisanym w HTML. Ale wielu projektantów nie lubi tej opcji. Wynika to z faktu, że wówczas na całym kanale zespołów trudno jest znaleźć opis parametrów i zarządzać wszystkim. Znacznie łatwiej jest przypisywać style w osobnym dokumencie.
Jeśli CSS znajduje się osobno, są one połączone za pomocą znacznika . Musi być umieszczony w
i . W tej notatce musisz określić atrybut href, który pokaże adres pliku z CSS.Jeśli polecenia zostaną ponownie skompilowane jako osobny plik,Łączymy je z dokumentem internetowym za pomocą dyrektywy @import. Musi być napisany między znakami . Zaraz po . Czwarty sposób polega na umieszczeniu reguł w sercu jednego z tagów, poprzez atrybut style. Następnie reguły wpłyną na osobny parametr, który mieści się w granicach określonego tekstu.
Pierwsze dwie metody oznaczały pojawienie się zewnętrznych arkuszy stylów, a drugie - wewnętrzne.
Do czego używane są czcionki?Oczywiście, każdy właściciel strony chce, aby jego zasoby wyglądały nie tylko pięknie, ale także niepowtarzalnie. Chciałbym umieścić na stronach specjalne elementy, które mogłyby się wyróżnić spośród wszystkich. Ponadto często zauważasz nagłówki lub menu niestandardowego pisania.
Jest wiele pytań na ten temat.Być może webmasterzy wykorzystali obraz narysowany w Photoshopie. Może ta opcja pojawiła się dzięki Flashowi. Istnieje opcja, która używa Javascript. Ale jak pokazuje praktyka, pierwsza opcja jest niewygodna i powolna, druga jest przestarzała, a trzecia jest zbyt zagmatwana. Aby stworzyć coś nowego i pięknego, możesz spróbować połączyć czcionki CSS.
Należy rozumieć, że w naszym przypadku czcionki sąnie tylko określony styl, ale także zestaw wielu właściwości, które są potrzebne do kontrolowania wyglądu tekstu. Możesz skorzystać z kilku opcji. Przypisz określoną czcionkę do nagłówka, akapitu, cytatu, tekstu podstawowego, menu i nie tylko.
Pomimo tego, że użytkownik ma dostęp do ogromnegoróżnorodność stylów, rozmiarów, gramatur itp., ważne jest, aby nie zapomnieć o czytelności. Lepiej unikać mieszanki różnych stylów. Wystarczą dwie czcionki na stronie.
Aby móc wybrać stylczcionka używa rodziny czcionek. Bardzo trudno jest jednoznacznie zrozumieć, czy na komputerze czytnika zasobu znajduje się określona czcionka; lepiej jest wprowadzić wszystkie opcje tego samego typu. W takim przypadku przeglądarka internetowa wybierze tę, która znajduje się w systemie użytkownika.
Ta rodzina ma wiele znaczeń. Na przykład nazwa rodziny jest reprezentowana przez nazwę rodziny czcionek. Wartość generic-family definiuje pięć głównych rodzin czcionek.
Za wybór stylu odpowiedzialna jest rodzina stylów czcionek. Ten styl jest dziedziczony, podobnie jak poprzedni. Znaczenia obejmują regularne lub kursywa i kursywa. Za kapitaliki odpowiada styl font-variant. Aby uzyskać nasycenie, użyj grubości czcionki itp. Czcionce można przypisać rozmiar i kolor.
Oprócz standardowych czcionek możesz użyćniestandardowe rozwiązania. Zwykle są bardziej unikalne i najprawdopodobniej nie zauważysz ich na stronach konkurencji. Nie musisz do tego używać obrazków, javascript i flasha. Wystarczy przyjąć regułę @ font-face. Umożliwia użytkownikowi załadowanie zewnętrznego pliku do dokumentu.
Ta metoda umożliwia podłączenie czcionki CSSOTF i TTF. Są to specjalne formaty, które wykonują całkiem niezłą robotę. Problemy mogą wystąpić tylko w przypadku przeglądarki Internet Explorer. Chociaż po raz pierwszy zaczął używać czcionek innych firm w 1997 roku, teraz ma surowe wymagania.
Robi dużo, żeby zepsuć twoją pracę. Często potrafi skompresować plik czcionką, czasami może go zaszyfrować. Dlatego dochodzi do różnego rodzaju włamań.
Obecnie istnieje kilka formatów czcionekpotrzebuję wiedzieć. W przeciwnym razie napotkasz szereg niespójności i niezgodności. Możesz podłączyć czcionkę CSS TTF. Ten format jest teraz obsługiwany przez wszystkie przeglądarki internetowe. Wyjątkiem może być Internet Explorer w wersji 8 i starszej, a także Opera Mini 5.0-8.0.
Tylko IE może współpracować z EOT. Sytuacja z WOFF jest taka sama jak z TTF. Ale SVG działa w przeglądarkach Chrome do wersji 37, a także w Safari, iOS Safari, przeglądarce Android. Jak pokazuje praktyka, najlepiej stosować TTF. Jest to najbardziej wszechstronna opcja i rzadko powoduje problemy. To jest najczęściej.
Tak więc, aby połączyć czcionkę jednego z plikówz powyższych formatów, po prostu użyj reguły @ font-face, o której mówiliśmy wcześniej. Aby było jasne, musisz postępować zgodnie z określonym algorytmem. Masz plik czcionki o nazwie font.ttf. Aby użyć go do głównego tekstu, musisz najpierw skopiować sam plik do folderu, w którym znajdują się wszystkie pliki witryny.
Jeśli chcesz użyć więcej niż jednej czcionki, możesz tutaj utworzyć specjalny folder, do którego je załadujesz. Ułatwi ci to znacznie ich odnalezienie i zmianę zawartości takiego folderu.
Teraz musimy sprawić, by przeglądarka sama pobierała naszą czcionkę. Aby to zrobić, musisz wydać mu instrukcje. Używamy dyrektywy @ font-face. Nasze polecenie będzie wyglądać następująco:
@ font-face {
rodzina czcionek: MyUniqueFont;
src: url ("fonts / font.ttf");
}
Polecenie rodziny czcionek jest odpowiedzialne za zapewnienie, że czcionkaotrzymała swoją nazwę, a potem mogła być użyta do pisania stylu. Druga linia zawiera wskazanie ścieżki, w której przeglądarka ma znaleźć styl i połączyć go. To nie jest adres uniwersalny. Ta ścieżka będzie się różnić w zależności od tego, gdzie umieściłeś plik czcionki. To pokaże, jak dołączyć czcionkę CSS z folderu.
Jeśli nie wiesz, jak połączyć wiele plikówCzcionki CSS, jest też instrukcja na ten temat. Pozwala na określenie wielu plików jednocześnie. Na przykład możesz podłączyć kilkanaście z nich. Aby to zrobić, musisz użyć już powyższej reguły @ font-face. Idąc za przykładem tego, jak wcześniej podłączyłeś jeden plik z folderu, w ten sam sposób, z nowej linii, wskaż linki do innych opcji czcionek.
Jeśli masz witrynę WordPress,łączenie stylów jest jeszcze łatwiejsze. Gdy chcesz zmienić styl nagłówka, wystarczy zalogować się do panelu administracyjnego. Tam poszukaj „Ustawienia motywu”. Sekcja Typografia będzie miała całą listę różnych opcji. Wystarczy zaznaczyć i zapisać zmianę.
Bardzo często używająUsługa Google Fonts. Jest to popularne narzędzie do wybierania i łączenia stylów. Jest tu wiele zestawów czcionek. Aby je połączyć, wystarczy wejść na oficjalną stronę.
Zobaczysz całą listę z przykładami imożliwość eksperymentowania. Po dodaniu żądanego stylu nie zapomnij wybrać cyrylicy, jeśli Twój zasób jest w języku rosyjskim. Następnie możesz wybrać rozmiar, styl lub od razu wybrać kilka opcji na każdą okazję.
Następnie będziesz mieć gotowy kod, którego potrzebujeszustawiony na plik CSS. W tym przypadku obowiązuje również zasada dodawania metod. Na przykład, jeśli arkusze stylów są prezentowane jako oddzielny dokument, to polecenie jest wysyłane do pierwszej linii. Jeśli masz arkusze stylów bezpośrednio w pliku HTML, musisz dodać je do treści tagów <style> i </style>.
Dodawanie nowych czcionek do witryny jest łatwe. Ważne jest, aby natychmiast zdecydować o metodach i opcjach. W zależności od systemu, w którym znajduje się Twoja witryna, musisz przemyśleć te działania. Jeśli masz samodzielnie napisany zasób, w tym przypadku jest kilka opcji. Jeśli na przykład na WordPressie, ta operacja jest znacznie łatwiejsza niż mogłoby się wydawać.
