Как сделать что бы ,вложенный блок с текстом не был прозрачным?

Question

[Вадим Ягофаров]

Есть слайдер bootsrap 4, на нем есть блок внутри него блок с текстом. Для родительского блока задано свойство
background-image: linear-gradient(to top, #2c0a7a 0%, #e1405a 100%);
opacity: 0.72;
В результате чего текст и кнопка становятся тоже прозрачными, чего совсем не надо, подскажите пожалуйста как этого можно избежать

Comments

[Eugene Chefranov]

укажите цвет градиента не в HEX а в RGBA с прозрачностью

background-image: linear-gradient(to top, rgba(44, 10, 122, 0.7) 0%, rgba(225, 64, 90, 0.7) 100%);

Answer 1

[Eugene Chefranov]

background-image: linear-gradient(to top, rgba(44, 10, 122, 0.7) 0%, rgba(225, 64, 90, 0.7) 100%);

Comments

[Вадим Ягофаров]

спасибо

Answer 2

[Александр Лысенко]

Задавать цвет в rgba

linear-gradient(to top, rgba(255,0,0,0), rgba(255,0,0,0));

rgba(255,0,0,0) - где последний 0 это ваше opacity. Ставите 0.1 0.2 0.3 и до 1
rgba(255,0,0,0)

в вашем случае - 0.7

linear-gradient(to top, rgba(255,0,0,0.7), rgba(255,0,0,0.7));

Answer 3

[Дмитрий Гончаров]

1) Сделать фон при помощи :before
2) Избавиться от opacity, заменив его rgba(...) для цветов и полупрозрачными *.png для изображений.
3) отдельный блок(почти то же, что и :before)