Как решить прозрачность фона CSS?

Question

все

Как вы можете видеть на изображениях, у меня градиентный фон (это адаптивный макет), и я хочу показать отзывы об этом.проблема в том, что я хочу прозрачный bg.

я пытался использовать это

.transparent {
    zoom: 1;
    filter: alpha(opacity=50);
    opacity: 0.5;

}

, но это показывает, что это не мое решение

Как я могу установить отзывы BG так же, как на моем веб-сайте BG.Может ли полупрозрачный png быть единственным или иным способом решить эту проблему?

заранее спасибо ...

Answer 1

Попробуйте использовать rgba в качестве фона.Это дает вам возможность прозрачности фона.Вот маленький калькулятор, который я использую все время, чтобы получить гекс в rgba http://hex2rgba.devoth.com/.

Я не совсем уверен, что понимаю вопрос, но это то, что вы можете использовать, если хотите полупрозрачность.Для полной прозрачности просто используйте background: transparent.И это должно работать.

РЕДАКТИРОВАТЬ: Я думаю, что теперь я понимаю вопрос больше.Причина, по которой вы получили результат, заключается в том, что вы установили весь элемент с непрозрачностью 0,5, а не только фон.Если вы используете rgba, как я и предлагал, вы можете установить полупрозрачный фон, как это

background: rgba(238, 238, 238, 0.5);

Answer 2

попробуйте это

.transparent {
        /* Required for IE 5, 6, 7 */
        /* ...or something to trigger hasLayout, like zoom: 1; */
        width: 100%; 

        /* Theoretically for IE 8 & 9 (more valid) */
        /* ...but not required as filter works too */
        /* should come BEFORE filter */
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";

        /* This works in IE 8 & 9 too */
        /* ... but also 5, 6, 7 */
        filter: alpha(opacity=50);

        /* Older than Firefox 0.9 */
        -moz-opacity:0.5;

        /* Safari 1.x (pre WebKit!) */
        -khtml-opacity: 0.5;

        /* Modern!
        /* Firefox 0.9+, Safari 2?, Chrome any?
        /* Opera 9+, IE 9+ */
        opacity: 0.5;
}

или что-то в этом роде

.transeffect {
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
opacity: 0.5;
}