简单的折叠式突出标题样式

最简单的没有CSS3的就用PNG，CSS为绝对定位，负像素左移。
.siteTag {
position: absolute;
left: -16px;
top: 109px;
z-index: 10;
65px;
height: 46px;
padding:0;
margin:0 10px 0 0;
vertical-align:middle;
border:0 none;
background: transparent url(../img/siteTag.png) scroll no-repeat 0 0;
}父级DOM
.content {position: relative; 940px;margin: 0 auto;}

效果如下


如果用到CSS3，则可以不用透明的PNG,而改为CSS阴影，甚至还有圆角：

.block article {
height: 130px;
padding: 10px 0;
border-bottom: 1px solid #e3e3e3;
position: relative;
}
/*此处显然用了HTML5标签article*/
article .entry-thumb {
88px;
height: 88px;
padding: 2px 4px;
position: absolute;
z-index: 1;/*父级的Z-INDEX*/
}

article .entry-thumb .zero {
background-image: url(../img/re-back.gif);
font-size: 14px;
text-align: center;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
88px;
height: 88px;
line-height: 88px;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
-webkit-box-shadow: rgba(0,0,0,0.4) 0 1px 1px;
-moz-box-shadow: rgba(0,0,0,0.4) 0 1px 1px;
box-shadow: rgba(0,0,0,0.4) 0 1px 1px;
}
article .entry-thumb img {
88px;
height: 88px;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
-webkit-box-shadow: rgba(0,0,0,0.4) 0 1px 1px;
-moz-box-shadow: rgba(0,0,0,0.4) 0 1px 1px;
box-shadow: rgba(0,0,0,0.4) 0 1px 1px;
}
article .entry-thumb span {
display: block;
16px;
height: 90px;
color: #FFF;
font-weight: bold;
position: relative;
top: -98px;
left: -24px;
padding: 15px 100px 1px 4px;
font-size: 14px;
-webkit-border-top-left-radius: 4px;
-webkit-border-top-right-radius: 16px;
-webkit-border-bottom-right-radius: 16px;
-moz-border-radius-topleft: 4px;
-moz-border-radius-topright: 16px;
-moz-border-radius-bottomright: 16px;
border-top-left-radius: 4px;
border-top-right-radius: 16px;
border-bottom-right-radius: 16px;
border: 1px solid;
border-color: #dfdfdf #dfdfdf #ddd #dfdfdf;
text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.5);
background: rgba(240,240,240,0.7);
-webkit-box-shadow: rgba(255, 255, 255, 0.3) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.3) 0px 1px 2px 0px;
-moz-box-shadow: rgba(255, 255, 255, 0.3) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.3) 0px 1px 2px 0px;
box-shadow: rgba(255, 255, 255, 0.3) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.3) 0px 1px 2px 0px; z-index: -1; /*此处为负Z-INDEX*/
}
article .entry-thumb span:after {
content:"";
position: absolute;
left: 0;
top: 107px;
0;
height: 0;
border-right: 9px solid #bbb;
border-bottom: 6px solid transparent;
}