2012-07-31 111 views
0

我使用邊框圖像在TH的左邊框上創建漸變,但右邊框必須牢固。但是邊界圖像適用於所有邊界,並且沒有邊界圖像權限來阻止它。我怎樣才能解決這個問題?其中一個邊框上的邊框圖像,其他實體上的邊框圖像

<style> 
TH { 
    border-left:1px solid; 
    -webkit-border-image:-webkit-linear-gradient(bottom, #BBB, rgba(255, 255, 255, 0)) 0 100% 
    border-right:1px solid #CCC; 
} 
</style> 

這是現在的樣子:

enter image description here

但是,這是註定的:

enter image description here

,你現在看到的右邊界有一個梯度但我希望它像第二個圖像一樣堅實。

+0

給你的HTML代碼來理解你想要的東西。 – 2012-07-31 09:55:14

+0

我添加了圖片。 – Ali 2012-07-31 10:14:20

回答

1

你怎麼看待這樣的黑客什麼:

<th style="width:104px; height:100px; background:url(up-down-gradient.png)"> 
    <div style="width:100px; height:100px; border-right:2px solid #888; margin-left:2px"></div> 
</th> 
+0

我做不到。看看我添加的圖像。 – Ali 2012-07-31 10:13:50

+0

我編輯了答案 – bogatyrjov 2012-07-31 10:28:46

+0

不錯的招數,但不正確的方式:) – 2012-07-31 11:08:39

2

您已經添加了邊框的漸變效果。取而代之的是創建一個你想用作邊框的圖像。
請參閱此link並查看它們用於給出邊框的原始圖像。你會通過這樣做得到你的輸出。

+0

它的簡單..它工作..? – 2012-07-31 10:59:53

+0

其在我的情況下工作,但不在IE中工作.. – 2012-07-31 11:00:17