Архив рубрики: 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 — селекторы

CSS — основы

CSS для чайников, часть 1Привет, друзья! Недавняя запись по поводу создания идеально круглой картинки посредством CSS надоумила меня на создание ряда записей, посвященных потрясающе удобной технологии CSS (Cascading Style Sheets — что в переводе звучит приблизительно как «Каскадная таблица стилей»).

Сегодня мы определим, где и с помощью каких методов будет проходит демонстрация работы CSS, ну и узнаем пару интересных вещей об этой технологии, да.

Итак, для демонстрации работоспособности Читать далее CSS — основы