How would you add background support for background color with alpha for legacy browsers?

Question

I am trying to set the background color, but I want to use the alpha channel. Is there a way to support new browsers with transparency and ensure that older browsers display the correct color when transparency is not an option?

For example, the second value will be enough or will be canceled:

background-color: rgb(255, 0, 0);       // older browsers
background-color: rgba(255, 0, 0, 0.5); // newer browsers

UPDATE:
I do not want to maintain the transparency of older browsers. I want to make sure that older browsers use the correct background color and newer browsers, if they support it, show the alpha channel.

Answer 1

PNG . - :

, :

.parent {position: relative; width: 150px; height: 150px; margin: 20px; border: 1px solid #999; display: inline-block;}
.child {position: absolute; width: 50px; left: 50px; top: 50px; height: 50px; background: url("https://upload.wikimedia.org/wikipedia/commons/d/d3/Black_%2850%25_transparent%29.png") repeat;}

#one {background: #ff9;}
#two {background: #99f;}

<div class="parent" id="one">
  <div class="child"></div>
</div>

<div class="parent" id="two">
  <div class="child"></div>
</div>

Hide result