W3.CSS Текст
Выравнивание текста
Классы w3-left-align и w3-right-align используются для выравнивания текста.
Выровненный по левому краю текст.
Выровненный по правому краю текст.
Пример
<div class="w3-container w3-border w3-large">
<div class="w3-left-align"><p>Выровненный по левому краю текст.</p></div>
<div class="w3-right-align"><p>Выровненный по правому краю текст.</p></div>
</div>
Попробуйте сами »
Центрирование элементы
Класс w3-center используется для выравнивания элементов по центру (центрирования):
Центрированный контент
Какой-то центрированный текст.
Пример
<div class="w3-container w3-center">
<h2>Центрированный контент</h2>
<img src="img_car.jpg" alt="автомобиль" style="width:80%;max-width:320px">
<p>Какой-то центрированный текст.</p>
</div>
Попробуйте сами »
Широкий текст
Класс w3-wide определяет более широкий текст:
Этот текст обычный.
Этот текст шире.
Непрозрачность текста
Класс w3-opacity предназначен для работы со всеми цветами:
Непрозрачность текста
Непрозрачность текста
Непрозрачность текста
Непрозрачность текста
Пример
<div class="w3-panel w3-pink">
<h2 class="w3-opacity">Непрозрачность текста</h2>
</div>
Попробуйте сами »
Тень текста
Свойство CSS3 text-shadow можно использовать для добавления к тексту эффектов тени или размытия:
Тень текста
Тень текста
Тень текста
Тень текста
Спецэффекты для текста
Непрозрачность текста + Жирный текст
Желтый текст + Тень + Жирный текст
Оранжевый текст + Тень + Жирный текст
Пример
<div class="w3-panel w3-pink">
<h1 class="w3-opacity">
<b>Непрозрачность текста + Жирный текст</b></h1>
</div>
<div class="w3-panel w3-amber">
<h1 class="w3-text-yellow"
style="text-shadow:1px 1px 0 #444">
<b>Желтый текст + Тень + Жирный текст</b></h1>
</div>
<div class="w3-panel w3-blue">
<h1 class="w3-text-orange"
style="text-shadow:1px 1px 0 #444">
<b>Оранжевый текст + Тень + Жирный текст</b></h1>
</div>
Попробуйте сами »
Тень текста не работает в IE 9 и более ранних версиях.
