Code snippet -- Tab

Tab is often used when writing HTML.

HTML structure:

 1   <  Div  Class  = "Tab tab_survey"  > 
 2       <  Div  Class  = "Tab_hd Clearfix"  > <  A  Class  = "Curr" Href  = "#"  > Single-question survey </  A  > <  A  Href  = "#"  > Multi-subject survey </  A  > </  Div  > 
 3       < Div  Class  = "Tab_bd"  > 
 4           <  Div  Class  = "Tab_cont curr"  > 
 5               <  Ul  Class  = "List_survey_content"  > 
6                   <  Li  > Test </  Li  > 
 7                   <  Li  > Test </  Li  > 
 8                   <  Li > Test </  Li  > 
 9               </  Ul  > 
 10           </  Div  > 
 11           <  Div  Class = "Tab_cont"  > </  Div  > 
 12       </  Div  > 
 13   </  Div  > 

CSS:

 1   . Tab_hd { Border-left :1px solid # ccc ; Margin-bottom : -1px ; Line-height : 25px ;   } 
  2   . Tab_hd { Float : Left ; Width : 100px ; Height :24px ; Color : #1e50a2 ; Border-top : 1px solid # ccc ; Border-Right : 1px solid # ccc ; Text-align : Center ;} 
  3   . Tab_hd. curr { Font-weight :Bold ; Height : 25px ; Background-color : # Fff ; Position : Relative ;} 
  4   . Tab_bd { Border : 1px solid # ccc ; Padding : 10px ; Border-bottom-left-radius : 5px ; Border-bottom-right-radius : 5px ;} 
  5   . Tab_cont { Display : None ;} 
  6   . Tab. tab_bd. curr { Display : Block ;}