Question

I have two layer, I’d like both to blend, how can I change their transparency to make one see-able from its upper overlapped area.

Answer 1

You need to use z-index, position, and opacity

HTML:

<div id="layer1"></div>
<div id="layer2"></div>

CSS:

#layer1, #layer2 {
    position:absolute;
    top:0;
    left:0;
    width:500px;
    height:500px;
}

#layer1 {
    z-index:0;
    background-color:red;
}

#layer2 {
    z-index:1;
    background-color:blue;
    opacity:0.5;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=50);
}

Demo: http://jsfiddle.net/AlienWebguy/QqEdb/