Возможно вы помните, что в одном из прошлых статей я говорил о желании побить свой рекорд по самому короткому посту на блоге. Ну что ж, сегодня я намерен это сделать. Достигну я этой цели при помощи свойства font-variant, а если быть точнее, расскажу вам о том, для чего оно нужно. Забегая вперед скажу, что при помощи нее мы можем отображать текст в малых прописных буквах.

Видеоверсия:
CSS-font-variant-буквы

Свойство font-variant

Представим, что у нас появилась необходимость в отображении всех абзацев в прописных буквах, но при этом чтобы они были маленького размера. В этом нам не сможет помочь ни один стиль, который мы изучили. Для решения данной задачи мы создаем следующее CSS правило:

p, h1 { font-variant: small-caps; }

Отлично, как видите, все довольно просто: мы указали соответствующее свойство и значение small-caps. Обратите внимание, что для заголовка я также применил этот параметр. Вот как это выглядит на практике:

CSS font-variant картинка
Вся веб-страница в малых прописных буквах

Так как вышеназванное свойство наследуется, существует второе значение — normal, используя которое мы отменяем наследование. Чтобы отменить подобный параметр для вложенных элементов, например для ссылок, мы указываем следующее:

a { font-variant: normal; }

Смею предположить что вам все понятно, если нет — задавайте свои вопросы в комментариях. А на этом у меня все. Надеюсь, данный урок по CSS был для вас полезен. Если это так:

  • Сделайте репост данной статьи в социальных сетях, чтобы больше людей получили от нее пользу;
  • Подписывайтесь на мою рассылку, чтобы не пропустить полезные и интересные публикации на блоге.

На этом я с вами не прощаюсь. Спасибо за внимание и до встречи в следующих публикациях!

Оставить комментарий

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

Вы можете использовать следующие теги HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

шестнадцать − семь =

Закрыть