Как сделать прозрачность фона css

Прозрачный фон или текст с помощью CSS

Сегодня в своей практике столкнулся с тем, что для фона меню необходимо было поставить прозрачность. Был вариант конечно сделать это с помощью картинки .png, но все же решил покапать и сделать полупрозрачный фон с помощью CSS. Оказалось это совсем несложным 🙂

В html-коде прописываем "класс", для которого необходимо установить определенную прозрачность:

далее открываем таблицу стилей CSS и вбиваем там свойства для данного "класса":

тем самым я указал цвет фона, выставив значения для трех основных цветов (красный — r, зеленый — g, синий — b), и прозрачность фона на 50% ( alpha — a) одним свойством. Значения для цвета указывается в диапазоне от 0 до 255, а для прозрачности диапазон будет от 0.0 до 1.0

Свойство rgba применимо также для всех других элементов. Но если станет необходимым установить прозрачность для всех элементов находящихся в данном классе, то можно воспользоваться свойством opacity, что устанавливает прозрачность для целого элемента или всей страницы. тогда код будет выглядеть так:

В таком случае прозрачными станут все элементы, находящиеся в данном классе, в том числе картинки и текст будут прозрачными.

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

Ваш адрес email не будет опубликован. Обязательные поля помечены *