Jeśli jesteś projektantem lub webmasterem, najprawdopodobniej będziesz wiedział, jak podłą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, to ta wiedza powinna ci pomóc. Ale lepiej zacząć od początku, zrozumieć, jakie są kaskadowe arkusze stylów, skąd pobrać czcionki i gdzie je zainstalować.

Opis

Tak więc odpowiedź na pytanie, jak dołączyć czcionkę CSS do strony, musi zaczynać się od opisu bezpośrednio sformalizowanego języka. CSS to kaskadowy arkusz stylów. Ten język jest używany jako opis wyglądu dokumentu. Działa w parowaniu z językiem znaczników.


CSS stara się wskazać wizualne cechy stron w Internecie. Te ostatnie powinny być tworzone na podstawie specjalnych języków znaczników HTML lub XHTML.

Użytkowanie

Kto potrzebuje CSS? Łączenie czcionek, ustawianie kolorów, wstawianie bloków i więcej jest wymagane dla webmasterów, programistów pracujących nad tworzeniem strony. Głównym zadaniem kaskadowania arkuszy stylów jest wizualne podzielenie struktury. Oznacza to, że jeśli HTML tworzy solidny blok tekstu, to CSS pomaga warunkowo "ozdobić" ten blok, podświetlić elementy i przypisać opcje. Separacja zapewnia dokumentowi dostępność, większą elastyczność i kontrolę. Pozwala pozbyć się złożonych i powtarzalnych elementów treści.

Łączenie

Zanim zrozumiesz, jak poprawnie dołączyć czcionki do CSS, musisz dowiedzieć się, jak kaskadowe arkusze stylówzsynchronizuj z plikiem. Zasady są realizowane w tym samym języku. Sam arkusz stylów ma reguły CSS, z których korzysta. Tabele mogą znajdować się zarówno w edytowanym wizualnie dokumencie, jak iw oddzielnym pliku z rozszerzeniem .css. W tym pliku znajdują się zwykle jedynie komendy i notatki.


Staje się jasne, że arkusz stylów można połączyć kilkoma metodami. Rozważmy je dalej.

Metody

Istnieją cztery opcje, które mogą pomóc w łączeniu czcionek, CSS, przypisywaniu odcieni, definiowaniu bloków itp. Jak wspomniano wcześniej, zestaw reguł może znajdować się w pliku napisanym w HTML. Ale ten projekt nie lubi wielu projektantów. Wynika to z faktu, że trudno jest znaleźć parametry w całym płótnie zespołów i zrobić to wszystko. Znacznie łatwiej jest przypisać style do osobnego dokumentu. Jeśli CSS są umieszczone osobno, są one połączone za pomocą znacznika. To musi być umieszczone w środku i. W tym znaczniku musisz określić atrybut href, który wyświetli adres w pliku CSS. Jeśli zespoły zostaną ponownie połączone przez osobny plik, połączymy je z dokumentem internetowym za pomocą instrukcji @import. Konieczne jest pisanie między znakami. Natychmiast po. Czwarta metoda polega na umieszczeniu reguł na podstawie jednego z tagów, poprzez atrybut stylu. Następnie reguły wpłyną na oddzielny parametr, który znajduje się w określonym tekście.
Dwie pierwsze metody oznaczały pojawienie się zewnętrznych arkuszy stylów, a drugie - wewnętrzne.

Czcionki

Dlaczego zazwyczaj używa się czcionek? Oczywiście wszyscywłaściciel strony chce, aby zasób wyglądał nie tylko pięknie, ale także unikalnie. Chciałbym umieścić na stronach specjalne przedmioty, które można by przypisać do wszystkich. Będziesz również często zauważać nagłówki menu lub niestandardowe pisownię. Jest wiele pytań na ten temat. Być może webmasterzy użyli obrazu przedstawionego w Photoshopie. Może ta wersja pochodzi z Flash. Istnieje wariant, który używał javascript. Ale praktyka pokazuje, że pierwsza opcja jest niewygodna i powolna, druga jest przestarzała, a trzecia jest zbyt zamrożona. Aby stworzyć coś nowego i pięknego, możesz spróbować podłączyć czcionki CSS.

Właściwości

Warto wiedzieć, że w naszym przypadku czcionki są nie tylko pewnym stylem, ale także zestawem właściwości potrzebnych do kontrolowania wyglądu tekstu. Istnieje kilka opcji do wykorzystania. Przypisać określoną czcionkę dla nagłówka, akapitu, cytatu, głównego tekstu, menu itp. Pomimo faktu, że użytkownik ma do dyspozycji ogromną różnorodność czcionek, rozmiarów, nasyceń itp., Ważne jest, aby nie zapominać o czytelności. Najlepiej unikać dużej kumulacji różnych stylów. Na stronie będzie wystarczająco dużo dwóch czcionek.

Rodziny

Aby móc wybierać style czcionek, należy użyć rodziny czcionek rodzinnych. Bardzo trudno jest jednoznacznie zrozumieć, czy czytelnik twojego zasobu ma określoną czcionkę, lepiej jest pisać wszystkie tego samego rodzaju opcje. W takim przypadku przeglądarka wybierze spośród nich taką, która zostanie znaleziona w systemie użytkownika. W kolekcji jest wiele wartości. Na przykład nazwiskoreprezentowane przez nazwę rodziny czcionek. Wartość ogólna i rodzinna określa piątkę rodziny czcionek. Rodzina czcionek odpowiada za wybór projektu. Ten styl jest dziedziczony jak poprzedni. Wśród wartości są zwykłe lub pochylone czcionki i kursywa. Styl czcionki jest odpowiedzialny za małe wielkie litery. Dla nasycenia użyj czcionki, itp. Można przypisać rozmiar i kolor czcionki.

Rozwiązania niestandardowe

Oprócz standardowych czcionek można stosować niestandardowe rozwiązania. Są zwykle bardziej unikalne i najprawdopodobniej nie zauważysz ich na stronach konkurentów. Aby to zrobić, nie musisz używać obrazów, javascript i flash. Wystarczy zastosować zasadę @ font-face. Pozwala użytkownikowi pobrać zewnętrzny plik do dokumentu. Ta metoda umożliwia dołączenie czcionki CSS OTF i TTF. Są to specjalne formaty, które sprawdzają się w podobnych zadaniach. Problemy mogą wystąpić tylko w przeglądarce Internet Explorer. Pomimo tego, że po raz pierwszy zaczął używać czcionek stron trzecich w 1997 roku, stawia teraz ostre wymagania. Robi dużo, by zepsuć twoją pracę. Często może kompresować plik za pomocą czcionki, czasami może go zaszyfrować. Dlatego są różne rodzaje khaki.

Formaty

Obecnie istnieje kilka formatów czcionek, które należy znać. W przeciwnym razie napotkasz serię niespójności i niezgodności. Możesz podłączyć czcionkę CSS TTF. Ten format jest teraz obsługiwany przez wszystkie przeglądarki. Wyjątkiem może być Internet Explorer 8 i niższy, a także Opera Mini 5.0-8.0. Z EOT możedziała tylko IE Sytuacja z WOFF jest taka sama jak w przypadku TTF. Ale SVG działa w przeglądarkach Chrome do wersji 37, a także Safari, iOS Safari, Mozilla. Jak pokazuje praktyka, najlepiej używać TTF. Jest to najbardziej uniwersalna opcja, która rzadko powoduje problemy. Jest to najczęściej.

Zasada

Aby połączyć czcionkę jednego z powyższych formatów, wystarczy użyć zasady @ font-face, o której wcześniej rozmawialiśmy. Aby było jasne, musisz przejść przez konkretny algorytm. Masz plik font.ttf. Aby użyć go do tekstu głównego, musisz najpierw skopiować plik do folderu, w którym znajdują się wszystkie pliki w witrynie. Jeśli chcesz użyć więcej niż jednej czcionki, możesz utworzyć specjalny folder, aby pobrać je. O wiele łatwiej będzie je znaleźć i zmienić zawartość takiego folderu. Teraz musisz się upewnić, że sama przeglądarka pobrała naszą czcionkę. Aby to zrobić, daj mu wskazówkę. Używamy dyrektywy @ font-face. Polecenie będzie wyglądać następująco: @ font-face {font-family: MyUniqueFont; src: url ('fonts /font.ttf'); } Polecenie rodzina czcionek jest odpowiedzialne za nadanie fontowi jego nazwy i po użyciu w arkuszu stylów. Drugi wiersz zawiera informację o ścieżce, którą przeglądarka musi znaleźć i połączyć się z nią. To nie jest adres uniwersalny. W zależności od tego, gdzie umieścisz plik w czcionce, ta ścieżka będzie również inna. W ten sposób dowiesz się, jak podłączyć czcionkę CSS z folderu.

Połączenie

Jeśli nie wiesz, jak podłączyć wiele czcionek CSS, istnieje również instrukcja obsługi tego konta. Ona jestpozwala określić wiele plików jednocześnie. Na przykład mogą być połączone z tuzinem. Aby to zrobić, musisz użyć powyższej reguły @ font-face. Jako przykład wcześniejszego połączenia pliku z folderu, podobnie jak w nowym wierszu, określ link do innych ustawień czcionki. Jeśli masz witrynę zbudowaną na WordPressie, łączenie stylów jest jeszcze łatwiejsze. Kiedy musisz zamienić czcionkę nagłówka, po prostu przejdź do panelu administracyjnego. Znajdziesz tam "Opcje motywu". W dziale "Drukarnia" pojawi się cała lista różnych wariantów. Musisz tylko wybrać i zapisać zmiany.

Inne opcje

Bardzo często czcionki czcionek Google są używane. Jest to popularne narzędzie do wybierania i łączenia stylów. Istnieje ogromna liczba zestawów czcionek. Aby je połączyć, po prostu przejdź do oficjalnej strony. Lista z przykładami i możliwością eksperymentowania pojawi się przed tobą. Po dodaniu pożądanego stylu nie zapomnij wybrać cyrylicy, jeśli Twój zasób jest w języku rosyjskim. Następnie możesz wybrać rozmiar, rysunek lub wybrać kilka opcji dla wszystkich okazji od razu. Następnie otrzymasz gotowy kod, który chcesz zainstalować plik CSS. W tym przypadku działa również zasada dodawania metod. Na przykład, jeśli arkusz stylów jest oddzielnym dokumentem, wysyłamy polecenie do pierwszego wiersza. Jeśli arkusz stylów znajduje się bezpośrednio w pliku HTML, musisz dodać go do treści znacznika.

Wnioski

Dodaj nowe czcionki do swojej witrynyto łatwe. Ważne jest, aby od razu określić metody i opcje. W zależności od systemu, w którym znajduje się witryna, należy pomyśleć o tych krokach. Jeśli masz pisemny zasób, w tym przypadku jest kilka opcji. Jeśli, na przykład, WordPress, ta operacja jest znacznie łatwiejsza, niż mogłoby się wydawać.