Как они используют непрозрачность в правом меню?

Question

http://pupunzi.com/ Как они используют непрозрачность для меню и почему текст может изменить прозрачность без изменения непрозрачности фона меню?

Answer 1

Это четвертая группа rgba(255, 255, 255, x.x), в качестве вашей шкалы вы используете 0,1 - 0,9.0,1 - 10%, 0,5 - 50% и т. Д.

Answer 2

Ниже представлен стиль, который они используют, поскольку вы можете видеть цветовое пространство rgba, которое принимает аргументы красного, зеленого, синего и альфа, где альфа - это канал прозрачности.

#navigation #menu {
    position: absolute;
    top: 0;
    left: 5px;
    padding: 35px;
/*padding-top: 50px;*/
    border-left: 1px solid rgba(255, 255, 255, 0.9);

    background: rgba(255, 255, 255, 0.3);

/* IE10 */
    background: -ms-radial-gradient(left top, circle farthest-corner, rgba(255, 255, 255, 0.9) 0%, rgba(38, 150, 165, 0.1) 75%);
/* Mozilla Firefox */
    background: -moz-radial-gradient(left top, circle farthest-corner, rgba(255, 255, 255, 0.9) 0%, rgba(38, 150, 165, 0.1) 75%);
/* Opera */
    background: -o-radial-gradient(left top, circle farthest-corner, rgba(255, 255, 255, 0.9) 0%, rgba(38, 150, 165, 0.1) 75%);
/* Webkit (Safari/Chrome 10) */
    background: -webkit-gradient(radial, left top, 0, left top, 1017, color-stop(0, rgba(255, 255, 255, 0.9)), color-stop(.75, rgba(38, 150, 165, 0.1)));
/* Webkit (Chrome 11+) */
    background: -webkit-radial-gradient(left top, circle farthest-corner, rgba(255, 255, 255, 0.9) 0%, rgba(38, 150, 165, 0.1) 75%);
/* Proposed W3C Markup */
    background: radial-gradient(left top, circle farthest-corner, rgba(255, 255, 255, 0.9) 0%, rgba(38, 150, 165, 0.1) 75%);

    width: 100%;
    height: 100%;
    -moz-box-shadow: -5px 1px 10px rgba(0, 0, 0, 0.4);
    -o-box-shadow: -5px 1px 10px rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: -5px 1px 10px rgba(0, 0, 0, 0.4);
    box-shadow: -5px 1px 10px rgba(0, 0, 0, 0.4);

}