Архив метки: css

Как задать межстрочный интервал с помощью CSS?

Привет всем! Сегодня мы разберемся с вопросом — Как задать межстрочный интервал с помощью CSS.

Для этого нужно всего лишь использовать атрибут line-height: . Важно — межстрочный интервал можно задать как в процентах, так и в пикселях. Пример работы кода — чуть ниже (в качестве текста-заглушки использован кусок из любимой мною книги «Мастер и Маргарита»).

И сразу чуть больше подробностей. В самой левой колонке межстрочный интервал задан в процентах: 200%. В средней колонке межстрочный интервал так же задан в процентах — 50%, а уже в самой правой колонке межстрочный интервал задан в пикселях, и равен 10 px.

See the Pen qVpvQv by Lavrynenko (@Lavrynenko) on CodePen.

Конечно же, в случае возникновения вопросов пишите на почту.

CSS выравнивание текста по вертикали и горизонтали

css выравнивание текста по горизонталиПривет, друзья!
Сегодня мы продолжим изучение CSS-стилей, и узнаем, каким образом можно сделать выравнивание текста по вертикали и горизонтали с помощью CSS.

Как всегда — пример рабочего кода будет доступен на вставке с ресурса http://codepen.io 🙂

Начнем с выравнивания текста по вертикали. Разделить этот момент можно на три части: выравнивание по верхнему краю, выравнивание по нижнему краю, и выравнивание по центру. Читать далее CSS выравнивание текста по вертикали и горизонтали

Шрифты в CSS

css-шрифтыПриветствую, друзья!

Сегодня мы узнаем, каким образом определяется шрифт в CSS, и познакомимся с методикой отображения шрифтов с засечками и без них.
Основными семействами шрифтов являются:
Georgia, Times New Roman, serif — шрифт без засечек
Arial, Helvetica, sans-serif — шрифт без засечек
Courier New, Courier, monospace — моноширинные шрифты
Verdana, Geneva, sans-serif — шрифт без засечек
Times New Roman, Times, serif — шрифт с засечками

Для визуальной разницы прошу посмотреть эту вставку:

See the Pen JEpQVM by Lavrynenko (@Lavrynenko) on CodePen.

Как видно из кода — в CSS с помощью селекторов (подробнее узнать о них вы можете вот тут) прописаны свойства всех семейств шрифтов в наклонном варианте, и нет (за это отвечает параметр font-style:italic)
Так же нужно отметить, что ничто не мешает использовать в параметре font-family свой оригинальный шрифт, но вопрос — будет ли этот шрифт на компьютере пользователя остается на ваше рассмотрение.

Из полезного могу так же указать параметры:
font-weight:bold — который определяет жирный шрифт
и font-size:10px (вместо десяти вы можете указать свой размер шрифта) — определяет кегль, используемый для нужного параметра

CSS — селекторы

Привет всем! Сегодня мы продолжим знакомство с потрясающей технологией CSS, в рамках чего и познакомимся с понятием «Селектор» (на всякий случай напоминаю — немного информации о CSS было представлено в этой записи).

Что есть селектор в CSS? На самом деле  CSS-стиль имеет две основные части — селектор и блок объявления, который в свою очередь обрабатывает параметры, отвечающие за свойства форматирования — текст, цвета, размер и прочее. Пример можно увидеть чуть ниже: Читать далее CSS — селекторы