Настройка шрифта CSS

Материал из Викижурнал
Перейти к навигации Перейти к поиску
CSS - Настройка фона
CSS Настройка фона
Селектор: body; table; tr; th; div; #name
Свойство: font-family; font-size; color; font-weight; font-style; text-align; text-decoration;
Значения:

Очень важно для любого сайте то, как выглядит шрифт, какого он размера, цвета, расположения и так далее, так как это влияет на восприимчивость текста и в последствии информации размещённой на странице. Благодаря настройкам CSS можно задать по умолчанию настройки размера, цвета и самого шрифта для всего сайта в целом, либо задавать нужные настройки шрифта в отдельно взятом блоке <div> или таблице <table> и в других элементах на странице.

Использование CSS для оформления сайтов можно обсудить в специально созданной теме нашего форума.

Настройки шрифта в CSS

Внутри любого блока можно задать параметры шрифта: его размер, цвет, тип шрифта и его выравнивание следующим образом:

#name {
font-family: Verdana;
font-size: 11px;
color: blue;
font-weight:bold;
text-align: center;
border: 1px solid black;
text-decoration: underline;
}

Получаем:

Меняем шрифт текста при помощи CSS

Пояснение к параметрам

  • font-family - тип шрифта, использовать можно стандартные шрифты, значения: Arial, Verdana, Times New Roman и так далее. Можно использовать нестандартные шрифты, но их нужно загрузить на сервер и в css прописать:
  • font-size - размер шрифта, можно задавать в пикселях
  • color - цвет шрифта, значения задаются словами либо в цифровом значении, как описано выше
  • font-weight - возможность сделать текст жирным, значение: bold - жирный
  • font-style - возможность сделать текст курсивным, значения: italic - курсив, или normal - обычный шрифт
  • text-align - выравнивание текста, значения: right - выравнивание по правой стороне center - выравнивание по центру left - выравнивание по левой стороне
  • text-decoration: underline - подчёркивает текст линией.

Можно задать тип шрифта на всей странице, чтобы не придавать это значение отдельному блоку по отдельности:

body {font-family: Verdana;}

В этом случае на всех страницах по умолчанию будет отображаться только шрифт Verdana и указывать его в отдельных блоках не нужно. Но изменить в отдельно взятом блоке шрифт можно точно также, как в вышеописанном примере. Тэг <body> универсален, в CSS можно задавать цвет фона, тип шрифта, отступы и другие настройки всем страницам одновременно, что облегчает жизнь веб-мастеру, если вносятся какие-либо изменения в дизайн сайта.

Примечание

Если же возникли трудности и есть какие-либо вопросы, как задать параметры тексту на странице или всему сайту, то можно задать вопрос в специально созданной теме про CSS на нашем форуме.

Статьи по теме CSS