Выравнивание текста css 23.04.2013

Всем привет! Мы продолжаем говорить о css. О самом интересном, на мой взгляд, языке к вебе. Ведь css дает нам реализовать именно тот свободный полет фантазии, который зарождается у нас в голове.

Правда сегодня речь пойдет не о таких серьезных и супер секретных приемах. Но тем не менее, основы которые нужно знать, всем. Тема нашего поста — выравнивание текста css. 

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

Как всегда ничего сложного в этом нет. Раньше, когда языка css еще не придумали, к тегу параграф, прописывали определенные атрибуты, чтоб сделать выравнивание.

Выглядело это вот так:

<p align="center">Выравнивание текста по центру</p>

<p align="right">Выравнивание по правому краю</p>

<p align="left">Выравнивание по левому краю</p>

<p align="justify">Выравнивание по ширине</p>

Неудобство этого метода очевидно. Например, у нас с тексте 15 параграфов и мы захотели выровнять их по ширине. Все сделали, обновили браузер и поняли, что текст смотрелся бы выгоднее если бы выравнивание было бы по центру.

Что надо сделать, чтоб исправить данную ситуацию и все таки сделать выравнивание текста css, а не через атрибуты? Естественно, изменить атрибуты у всех 15 параграфов, не очень быстрый способ...

Что же будет если мы решим выровнять текст по центру помощью css. А оказывается это будет в разы проще.

Мы открываем наш файл style.css и прописываем вот такую комбинацию:

 p {

text-align: center;

}

И весь наш текст становится выровненным по центру, для выравнивания в остальных случаях нам понадобятся следующие команды:

/* Выравнивание по ширине*/

p {

text-align: justify;

}

/* Выравнивание по правому краю*/

p {

text-align: right;

}

/* Выравнивание по левому краю*/

p {

text-align: left;

}

/* Выравнивание по левому краю*/

p {

text-align: left;

}

Для тех кто не знает, что вот это за комбинация — /*Комбинация*/, поясню. Именно так в файле стилей можно делать пометки. Эти надписи не будут отображаться браузерами.

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

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

До встречи на Sayt-Stroy.com

Метки: , ,

Оставь свой первый комментарий и получи книгу в подарок!

Данная книга расскажет о всех секретах правильного и полноценного продвижения интернет проектов.

Именно с нее следует начать изучение SEO.

WordPress

Добавить комментарий

ВКонтакте