Почему не меняется шрифт в css
Перейти к содержимому

Почему не меняется шрифт в css

  • автор:

Почему не меняется шрифт?

RAX7

Mrako_bes, значит что-то не так делаешь.
Я протестировал скачав этот шрифт с ofont. Все работает у меня на windows.

Создал папку с проектом
внутри файл index.html = подключаю css
папка fonst/ внутри папка Segoe WP и в ней уже шрифты.
папка css/ c файлом main.css = содержащая

@font-face < font-family: "SegoeWP"; src: url("../fonts/Segoe WP/ofont.ru_Segoe WP.eot"); src: url("../fonts/Segoe WP/ofont.ru_Segoe WP.eot?#iefix") format("embedded-opentype"), url("../fonts/Segoe WP/ofont.ru_Segoe WP.woff") format("woof"), url("../fonts/Segoe WP/ofont.ru_Segoe WP.ttf") format("truetype"); font-weight: normal; font-style: normal; >body

Mrako_bes @Mrako_bes Автор вопроса

Владимир, спасибо! ошибка как всегда идиотская, я случайно создал два одинаковых css файла и писал не в том. удалил ненужный файл, скопировал/вставил в нормальный.

Как изменить шрифт в css

Изменить используемый шрифт позволяет CSS свойство font-family . Это свойство принимает через запятую список шрифтов, которые мы хотим использовать. Когда указано несколько шрифтов, то браузер будет считывать их слева направо до первого шрифта, который он сможет использовать.

.font  font-family: Georgia, "Times New Roman"; > 

Если у пользователя в системе есть шрифт Georgia, то будет применен именно он. В случае его отсутствия браузер будет искать шрифт Times New Roman. Если же и Times New Roman не установлен, то браузер возьмёт шрифт из своих стандартных настроек.

Чтобы в этом случае не «сломалась» визуальная составляющая сайта, можно указать основное семейство шрифтов. То есть, если ни один из шрифтов не будет найден, браузер подберет системный шрифт из указанного семейства.

Основных семейств три:

  • serif шрифты с засечками
  • sans-serif шрифты без засечек
  • monospace все символы имеют одинаковую ширину, обычно такие шрифты используются в редакторах кода и терминалах.
.font  font-family: Georgia, "Times New Roman", serif; > 

Так как Georgia и Times New Roman относятся к семейству шрифтов с засечками, то укажем serif .

Html, css, не меняется размер шрифта и цвет?

У вас ошибка в названии класса (logotext), должно быть logo_text. + в css самый последний класс написан так: logo-text (через тире). Нужно чтобы классы в html коде и в css стилях имели одинаковые названия, а то стили не будут задаваться.

Sign up or Log in to write an answer

  • Интерактивные уроки и курсы программирования и создания сайтов (дистанционное обучение) помогут вам в игровой форме изучить основы языков программирования веб-разработки и веб-программирования с нуля. Обучение онлайн 24/7.

Общие ссылки

  • Отзывы
  • Политика конфидециальности
  • Условия использования
  • Блог
  • Цена и оплата
  • Курсы и скринкасты
  • Сертификаты
  • Партнерская программа
  • Комьюнити

Наши курсы и скринкасты

  • HTML/CSS Advanced
  • Bootstrap 4
  • Vue JS
  • Linux, GIT and web-hosting
  • HTML and CSS
  • Modern Javascript
  • Javascript/jQuery
  • Codeigniter
  • Все курсы и скринкасты

Почему не меняется шрифт в зависимости от жирности?

Однако везде стоит шрифт Muller, когда в body font-family, меняю шрифты местами (т.е. «MulleBold», «Muller»), то везде шрифт становится MullerBold.
Как это исправить? Заранее, спасибо, за любую помощь!

  • Вопрос задан более трёх лет назад
  • 616 просмотров

Комментировать
Решения вопроса 1

delphinpro

Сергей delphinpro @delphinpro Куратор тега CSS
frontend developer

Вы подключаете один и тот же шрифт и хотите чтобы он у вас отображался по разному?
Странное желание.

Во-первых, не нужно подключать ttf. Он огромен. Прогоните шрифт через трансфонтер и подключайте форматы woff2 и woff.

Во-вторых, у вас должны быть разные файлы с разными весами. Вот их все и нужно подключить, указывая соответствующий font-weight.

@font-face < font-family: 'MullerBold'; src: url('fonts/MullerBold-normal.woff2') format('woff2'); font-style: normal; font-weight: 400; >@font-face < font-family: 'MullerBold'; src: url('fonts/MullerBold-bold.woff2') format('woff2'); font-style: normal; font-weight: 700; >

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *