как изменить шрифт текста на нестандартный Blogger

Доброго времени суток, друзья. Сегодня шпаргалка о том, как легко можно заменить привычный шрифт на нестандартный. Именно такой (или любой другой) каким вы сейчас его видите. 

Можно добавить в блог новый и необычный шрифт от Гугл. Я писала об этом варианте в статье WEB-ШРИФТЫ для блога. Обойдёмся на этот раз без всяких скачиваний и подключений. Ниже приложила таблицу наиболее распространённых шрифтов. Ну и по теме немного информации в  самом посте. А пока перейду на обычный шрифт.


нестандартный шрифт в блоггере

К сожалению, в самом редакторе сообщений нам предлагается всего 7 стандартных видов. А если очень хочется чего - то необычного в тексте, будь то текст целиком, или отдельный фрагмент, или подзаголовок?

Попробуйте в черновике написать просто любое предложение. И в редакторе с помощью набора инструментов задаём ему синий цвет, нужный шрифт и размер. Допустим вот так

Этот текст будет примерно таким

Если перейти в режим HTML, то увидим весь код, а именно стили нашего текста, вот такого вида

<span style="color: #45818e; font-family: Courier New, Courier, monospace; font-size: large;">Этот текст будет примерно таким</span>

где

color: #45818e; - цвет самого текста
ont-family: Courier New, Courier, monospace; - семейство шрифтов
font-size: large; - размер шрифта

Собственно основные стили текста. Но сегодня речь о шрифтах. В таблице ниже вы можете выбрать нужный вам стиль текста и скопировать его название. К примеру я взяла шрифт Comic Sans Ms и заменила предыдущий на него. В результате получилось вот что. 

Этот текст будет примерно таким.

<span style="color: #45818e; font-family: comic sans ms;font-size: large;">Этот текст будет примерно таким.</span>

 распространённые русифицированные шрифты


Текст на странице Название шрифта
Шрифт- Arial
Шрифт- Arial Cyr
Шрифт- Arial Black
Шрифт- Book antiqua
Шрифт- Bookman old style
Шрифт- Calibri
Шрифт- Cambria
Шрифт- Candara
Шрифт- Century
Шрифт- Century gothic
Шрифт- Comic Sans Ms
Шрифт- Consolas
Шрифт- Constantia
Шрифт- Corbel
Шрифт- Courier
Шрифт- Courier New
Шрифт- Courier, monospace
Шрифт- Cursive
Шрифт- Franklin Gothic
Шрифт- Gabriola
Шрифт- Garamond
Шрифт- Georgia
Шрифт- Helvetica
Шрифт- Impact
Шрифт- Lucida console
Шрифт- Lucida Sans Unicode
Шрифт- Mistral (Mistral)
Шрифт- monospace
Шрифт- Monotype Corsiva
Шрифт- MS Sans Serif
Шрифт- MS Serif
Шрифт- Palatino Linotype
Шрифт- Sans-serif
Шрифт- Segoe print
Шрифт- Segoe script
Шрифт- Sylfaen
Шрифт- Tahoma
Шрифт- Times New Roman
Шрифт- Trebuchet ms
Шрифт- Verdana



Для информации - 

Параметр font-family определяет список семейств шрифтов. Обычно задаются несколько похожих шрифтов в порядке предпочтения, а их названия разделяются запятыми

Если название шрифта состоит из нескольких слов, то оно заключается в кавычки.Список шрифтов обычно начинается с желаемого шрифта и заканчивается названием общего семейства. Если на компьютере не установлены указанные шрифты, то браузер сам выбирает доступный.

Семейство шрифта (примеры)





  • <style="font-family: 'Times New Roman', Verdana, sans-serif;">
    пропала собака по кличке Дружок
  • <style="font-family: 'Monotype Corsiva', sans-serif;">
    пропала собака по кличке Дружок
  • <style="font-family: 'Comic Sans MS', sans-serif;">
    пропала собака по кличке Дружок


  • В интернете много информации по стилям шрифта, нет смысла повторяться. Ещё некоторые дополнения к статье про шрифты

    Размеры шрифта

    font-size: xx-small"> - очень очень маленький
    font-size: x-small"> - очень маленький
    font-size: small"> - маленький
    font-size: medium"> - средний
    font-size: large"> - большой
    font-size: x-large"> - очень большой
    font-size: xx-large"> - очень очень большой

    В Internet Explorer бывают проблемы с масштабированием текста. И чтобы их решить вместо пикселей используется значение em. 1em равен 16 пикселям.
    Допустим размер текста у нас рав 14px. Делим 14 на 16 получаем 14 / 16 = 0,875 em.

    font-size:0.875em;

    Имея минимальное представление о стилях шрифта, менять в Блоггер их можно где угодно. Это в самом посте, названии сообщения, подзаголовках, заголовках статей, гаджетов.

    В качестве примера покажу на заголовках гаджетов на тестовом блоге.  Все заголовки были обычные

    нестандартный текст в заголовке гаджетов

    Задала  некоторые стили для них и прописала непосредственно в шаблоне ко всем гаджетам сразу.


    шрифт заголовка гаджетов

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

    Возможно, кому - нибудь пригодится информация как подключить и использовать шрифт шрифт Font Awesome в блоге.

    Очень надеюсь, что хоть кому - то информация окажется полезной. Если возникли вопросы, пишите в комментариях.

    Всем успехов и до встречи.

    здесь можно оформить подписку на новые шпаргалки


    Введите Ваш email


    10 комментариев:

    1. Кому-то точно это окажется полезным. Спасибо.

      ОтветитьУдалить
      Ответы
      1. Саша, даже если и не пригодится для реализации, может так для информации нужным будет.

        Удалить
    2. Про шрифты - это интересно. Но нам с Серым гораздо интереснее было про собаку. Жалко, что она пропала.

      ОтветитьУдалить
      Ответы
      1. Семён, ну да, каждому своё. То что пришло на ум в момент написания статьи

        Удалить
    3. Спасибо, Вика!!!! Обалденный пост!

      ОтветитьУдалить
      Ответы
      1. Лена, здравствуй. Пользуйтесь конечно. Спасибо за отзыв.

        Удалить
    4. Интересно, Виктория! Но ничего менять не буду. Уже 5 лет в блогах использую один шрифт!

      ОтветитьУдалить
      Ответы
      1. Ирина, а разве я говорю, что менять что - то нужно. Вообще - то опытные блогеры советую иногда менять внешний вид сайта. Ни что на месте не стоит - меняется мода, стили, технологии, музыка и так далее. Даже привычные издания журналов меняют свой внешний вид.

        Удалить
    5. сохранила в закладках,пригодится.Мне быстро всё надоедает,часто что-то меняю,спасибо.Пока меня не было,столько новых фишек у тебя появилось.

      ОтветитьУдалить
    6. Ну с текстом тут вообще играться можно.

      ОтветитьУдалить

    ВСЕГДА РАДА УСЛЫШАТЬ ВАШЕ МНЕНИЕ!
    Ели у вас возникла необходимость опубликовать код в комментарии, то воспользуйтесь encoder HTML

    Пользовательский поиск