用DIV+CSS实现文字及面板阴影效果_html/css_WEB-ITnose

< style type ="text/css" >
#sfContainer1 {
font : bold 10pt simsun, tahoma ;
background-color : #808080 ;
height : 30px ;
line-height : 30px ;
padding-left : 20px ;
}
#sfFrontText {
color : #FFFFFF ;
position : absolute ;
padding : 0px ;
z-index : 1 ;
}
#sfBackText {
color : #000000 ;
position : absolute ;
padding : 2px 0px 0px 2px ;
z-index : 0 ;
}
#sfRowSpacer1 {
height : 20px ;
}
#sfContainer2 {
height : 150px ;
background-color : #808080 ;
}
#sfFrontPanel {
border : 1px solid #C0C0C0 ;
margin : 20px 0px 0px 20px ;
background-color : #FFFFFF ;
width : 150px ;
height : 60px ;
position : absolute ;
z-index : 1 ;
}
#sfBackPanel {
border : 1px solid #666666 ;
margin : 24px 0px 0px 24px ;
background-color : #000000 ;
width : 150px ;
height : 60px ;
position : absolute ;
z-index : 0 ;
}


< div id ="sfContainer1" >
< div id ="sfFrontText" >
ASP.NET 2.0服务器控件与组件开发高级编程
< div id ="sfBackText" >
ASP.NET 2.0服务器控件与组件开发高级编程

< div id ="sfRowSpacer1" >

< div id ="sfContainer2" >
< div id ="sfFrontPanel" >

< div id ="sfBackPanel" >