Почему не работает свойство rgba?

Question

[Василий Демянюк]

У меня в проекте используются scss и bootstrap. Когда я пробую использовать свойство rgba( ) , ноль реакции:

<div class="container-fluid">
    <div class="wrapper">
        <div class="row">
            <div class="col-lg-12 about">
                <p class="text-center">
                    Hello! Good to see You on my
                    <span>
                        protfolio
                    </span>
                    page.
                </p>
                <footer class="text-center">
                    You newer know who is going call first
                    <cite title="some title">
                        Newer....
                    </cite>
                </footer>
            </div>
        </div>
    </div>
</div>

$regular: OpenSans-Regular, sans-serif;
$italic: OpenSans-Italic, sans-serif;
$light: OpenSans-Ligth, sans-serif;
$bold: OpenSans-Bold, sans-serif;
body{

	background: url('/img/body-bg.png') repeat;
	font-family: OpenSans-Regular, sans-serif;
	color:#e8e8e8;
	font-weight: normal;
	font-size: 16px;
	min-width: 320px;
	position: relative;
	line-height: 1.6;
	overflow-x:hidden;
	
}
/**************************HEADER**********************/
.top-section{
	position: relative;
	background-color: #0c0c0c;
	.wrapper{
		margin: auto 220px;
		.logo{
			top:20px;
			position: absolute;
			vertical-align: middle;
		}
	}
}
.header-title{
	margin-left: 200px;
	li{
		font-size: 15px;
		line-height: 80px;
		margin-top: 10px;
		float: left;
		list-style: none;
		margin-left: 42px;
		font-family: $light;
		&:hover{
			cursor: pointer;
			color:#ff9800;
		}
	}
}

/**************************ABOUT**********************/

.about{
	min-height: 637px;
	font-family: $bold;
	background-image: url('/img/main.png');
	background-color: rgba(61 , 61 , 61 , 0.75);
	//opacity: 0.75;
		// color: #ffffff
	color: #000;
	
}

Но при использовании opacity все ок, но затемняет контент. В чем проблема?

Comments

[Ankhena]

Ответы уже есть ниже, добавить хочу, что rgba это не свойство, а форма записи цвета. Свойство это background-color.

Answer 1

[iBird Rose]

потому что у тебя спереди стоит background-image: url('/img/main.png'); а за ним уже твой rgba цвет. и за картинкой ты его не видишь. хочешь делать полупрозрачное наложение цветом - делай другой див и ставь его впереди этих и делай для него rgba

Comments

[Василий Демянюк]

Да, так и есть. Спасибо.

[Максим]

лучше делать через псевдоэлементы этот момент