Хочу рассказать Вам все о сайтах, что узнал сам за 15 лет.
Блог Виталия Жукова Vitalik.WS Свой сайт с нуля - легко!
Обо мне, как об авторе блога.
Подробнее
Vitalik.WSЗаметки → Прозрачный фон при помощи CSS (свойство background)

Прозрачный фон при помощи CSS (свойство background)
Заметка на тему: CSS

Вам нужно сделать прозрачный фон, но при этом не прозрачные буквы (то есть opacity для этого не подходит)? Тогда я расскажу об одной интересной особенности CSS параметра background.

Обычно заливка фона указывается вот таким способом (например серый цвет):
background: #dcdcdc;


Но есть и другой вариант указать тот же цвет, но уже с прозрачностью. Делается это вот так:
background: rgba(220, 220, 220, 0.7);

Где:
- первые 3 цифры (220, 220, 220) - это R, G и B координаты нужного цвета (можно подглядеть в палитре фотошопа, могу даже выложить фото, где именно, если интересно), причем они не всегда совпадают, просто в нашем случае так получилось;
- последняя цифра (0.7) - прозрачность в процентах, 0.7 = 70% (аналогично opacity впринципе).

Кстати, если кому-то нужен прозрачный чисто черный overlay, то он будет выглядеть вот так:
background: rgba(0, 0, 0, 0.7);

У черного RGB всегда 0, такой уж цвет.

Вот и весь секрет прозрачного background на CSS.
Верстайте на здоровье! =)

Все комментарии к заметке "Прозрачный фон при помощи CSS (свойство background)"

  • Комментариев еще нет.
    Оставьте свой комментарий первым!
Написать свой комментарий:
Отправить
ВНИМАНИЕ! Пожалуйста НЕ пишите в комментариях рекламу, оскорбления, бессмыслицу и прочие проявления интернет-нечисти, так как эти сообщения всеравно не будут опубликованы. Пишите исключительно по теме и ваш комментарий обязательно будет опубликован, а возможно и прокомментирован.
 Подписывайтесь на мой блог
Хотите первыми узнавать о самом интересном? Тогда подпишитесь на рассылку новостей.
Подписаться
Подписавшись на рассылку, Вы всегда будете в первую очередь узнавать о самой важной и полезной для блоггеров и веб-мастеров информации.