春風(fēng)博客
          

          

          春天里，百花香...
          

			
          
				
					

          導(dǎo)航
          

					
          
	
          
		
          <2008年10月>
          
	
          日一二三四五六
          2829301234
          567891011
          12131415161718
          19202122232425
          2627282930311
          2345678
          

          

					

          統(tǒng)計(jì)
          
	
					

          公告
          
	MAIL: junglesong@gmail.com
          
MSN: junglesong_5@hotmail.com
          

          
Locations of visitors to this page 

					

          常用鏈接
          


          留言簿(11)
          


		
          隨筆分類(224)
          
		
				
			
	
		
          隨筆檔案(126)
          
		
				
			
	
		
          個(gè)人軟件下載
          
		
				
			
	
		
          我的其它博客
          
		
				
			
	
		
          我的鄰居們
          
		
				
			
	


          最新隨筆
          




          搜索
          



          積分與排名
          



          最新評(píng)論
	
          

          
	
			
		

          


          閱讀排行榜
          



          評(píng)論排行榜
          


				
			
          
			
          
				
					
	
          
		
          
			使用CSS設(shè)置表格二
		
          
		下面是示例圖，blogjava的網(wǎng)友們都很熟悉吧。
          

          

          
CSS代碼：
          

          /*2008.09.28*/
          

          
Table.grayblogjava          {
          
    border-top          :0px solid #6b86b3;
          
    border-bottom          :3px solid #6b86b3;
          
    border-left          :0px solid #6b86b3;
          
    border-right          :0px solid #6b86b3;
          
          }
          

          
Table.grayblogjava caption          {
          
    font-size          :16px;
          
    font-weight          :bold;
          
    text-align          :left;
          
    
          
    border-top          :1px solid #999999;
          
    border-bottom          :1px dashed #999999;
          
    border-left          :0px solid #999999;
          
    border-right          :0px solid #999999;
          
    
          
    padding-left          :5px;
          
    
          
    background          :#e5eef7;
          
          }
          

          
Table.grayblogjava thead          {
          
    height          :31px;
          
    background          :#ffffff;
          
    border-top          :1px solid #e6e6e6;
          
    border-bottom          :1px solid #e6e6e6;
          
          }
          

          
Table.grayblogjava tbody          {
          
    height          :25px;
          
          }
          

          
Table.grayblogjava th          {
          
    border-bottom          :1px solid #6b86b3;
          
    text-align          :center;
          
          }
          

          
Table.grayblogjava tr.odd          {
          
    background-color          :#f5f5f5;
          
          }
          

          
Table.grayblogjava td          {    
          
    border-bottom          :1px solid #e6e6e6;
          
    
          
    padding-left          :5px;
          
    padding-right          :4px;
          
    padding-top          :4px;
          
    padding-bottom          :1px;    
          
    
          
    text-align          :left;
          
          }
          

          
Table.grayblogjava td a          {    
          
    color          :#6b86b3;
          
     text-decoration          : none;
          
          }
          

          
Table.grayblogjava td a:hover          {    
          
    color          :#cc0066;
          
     text-decoration          : underline;
          
          }
          

          

          

          
HTML代碼：
          

          <%@ page contentType="text/html; charset=UTF-8"%>
          

          
          <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
          
          <html>
          
          <head>
          
          <title>Css Table Sample 2</title>
          
          <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
          
          <link rel="stylesheet" rev="stylesheet" href="web/css/style.css" type="text/css" />
          
          <script src="web/js/formchecker.js" type="text/javascript"></script>
          
          <script src="web/js/ajax.js" type="text/javascript"></script>
          
          </head>
          

          
          <body>
          
              <table class="grayblogjava" width="600" cellspacing="0">
          
                  <caption>江山代有才人出 各領(lǐng)風(fēng)騷數(shù)百年(模擬Blogjava設(shè)置界面表格)</caption>
          
                  <thead>
          
                      <tr>
          
                          <th>三代</th>
          
                          <th>漢朝</th>
          
                          <th>晉朝</th>
          
                          <th>唐朝</th>
          
                          <th>宋朝</th>
          
                          <th>明朝</th>
          
                      </tr>
          
                  </thead>
          
                  <tbody>
          
                      <tr>
          
                          <td>孔子</td>
          
                          <td>董仲舒</td>
          
                          <td>阮籍</td>
          
                          <td>李白</td>
          
                          <td><a href="#">蘇軾</a></td>
          
                          <td><a href="#">王陽明</a></td>
          
                      </tr>
          
                      <tr class="odd">
          
                          <td>孟子</td>
          
                          <td>東方朔</td>
          
                          <td>嵇康</td>
          
                          <td>杜甫</td>
          
                          <td><a href="#">辛棄疾</a></td>
          
                          <td><a href="#">唐寅</a></td>
          
                      </tr>
          
                      <tr>
          
                          <td>老子</td>
          
                          <td>揚(yáng)雄</td>
          
                          <td>陶淵明</td>
          
                          <td>李商隱</td>
          
                          <td><a href="#">陸游</a></td>
          
                          <td><a href="#">徐渭</a></td>
          
                      </tr>
          
                      <tr class="odd">
          
                          <td>莊子</td>
          
                          <td>左思</td>
          
                          <td>王羲之</td>
          
                          <td>李賀</td>
          
                          <td><a href="#">范仲淹</td>
          
                          <td><a href="#">楊慎</td>
          
                      </tr>
          
                      <tr>
          
                          <td>荀子</td>
          
                          <td>司馬遷</td>
          
                          <td>庾信</td>
          
                          <td>王維</td>
          
                          <td><a href="#">歐陽修</a></td>
          
                          <td><a href="#">呂坤</a></td>
          
                      </tr>            
          
                      <tr class="odd">
          
                          <td>韓非子</td>
          
                          <td>班固</td>
          
                          <td>鮑照</td>
          
                          <td>居易</td>
          
                          <td><a href="#">蘇洵</a></td>
          
                          <td><a href="#">宋濂</a></td>
          
                      </tr>
          
                  </tbody>
          
              </table>
          
          </body>
          
          </html>
          

          
所有代碼下載：
          
http://www.aygfsteel.com/Files/sitinspring/CssTable220081003154430.rar 

		
          
			posted on 2008-10-03 15:35 sitinspring 閱讀(980) 評(píng)論(0)  編輯  收藏  所屬分類: HTML,CSS&JS 
		
          
	
          







          
	    
    




          








          

				
			
          
			
sitinspring(http://www.aygfsteel.com)原創(chuàng),轉(zhuǎn)載請(qǐng)注明出處.
    







          
        
	




主站蜘蛛池模板：
桂林市|
嘉祥县|
蒙自县|
乌海市|
鲁甸县|
克拉玛依市|
获嘉县|
长汀县|
东明县|
昔阳县|
宜君县|
岢岚县|
邵武市|
富锦市|
确山县|
中牟县|
巴林右旗|
福建省|
嘉兴市|
大连市|
论坛|
博野县|
双柏县|
杭州市|
甘谷县|
清远市|
盐山县|
巴东县|
黄骅市|
章丘市|
民丰县|
枞阳县|
六枝特区|
确山县|
碌曲县|
崇信县|
高雄市|
花垣县|
蓬安县|
绥德县|
鄯善县|