用樣式給table加入所有邊框

我們知道，單獨用table的boder只能建立線條新式唯一的table

 

而用table 裡面的style能建立線條樣式不唯一，但是只能建立

 

最外面的邊框，而不能把裡面的線條也畫上去

 

這裡有一個解決方案

 

    <style type="text/css">
        .table_border td
        {
            border-top:1px #DDD solid;
            border-right:1px #DDD solid;
            border-color:Blue;
        }
        .table_border
        {
         border-bottom:1px #DDD solid;
         border-left:1px #DDD solid;
         border-color:Blue;
         width:100%
        }
    </style>

 

只要table引用了class = "table_border" 就可以實現table裡所有方格

 

都可以有線條，並且樣式都可以自己定義

 

但是有一個問題，這樣出來的線條接合的不是很好，

 

很多串連的地方都會有一個口，實現不了無空隙接合，

 

最好是兩都加起來用，如下：

 

在table裡面加入

 

bordercolor="#CDE0F5"  cellspacing="0"   border="1" cellpadding="0"

 

然後再寫一個樣式

 

 .NewTableStyle
        {
            BORDER-RIGHT: #CDE0F5 1px solid;
            BORDER-TOP: #CDE0F5 1px solid;
            BORDER-LEFT: #CDE0F5 1px solid; 
            BORDER-BOTTOM: #CDE0F5 1px solid;
            BORDER-COLLAPSE: collapse; 
        }

 

給table加一個class為NewTableStyle的樣式

 

這樣就可以實現了為table加入了自己定義線條，

 

樣式就比原來的好看了不好，也不會出現有空隙的介面

 

但這樣就重複定義了某些地方的樣式，效率沒有第一個高

 

個人比較喜歡用第二種方法