復雜的按鈕精靈

Question

我有這個精靈：

鏈接http://gpanel.darrell.nl/images/derma.png

在右上角有4個按鈕圖像。 我喜歡使用按鈕，例如，角保持原樣，但其余部分可以拉伸。 我搜索了整個互聯網，但找不到任何東西。 如何使用CSS做到這一點？

左上方的窗框也一樣。

Answer 1

不幸的是，邊框圖像不適用於sprite，可以做到，但是需要額外的元素和一些不太優雅的技巧，下面是一個演示： http : //jsfiddle.net/sandro_paganotti/H2xgQ/1/

.border{
    border-right: 400px solid black; 
    border-bottom: 400px solid black;
    border-image: url('http://gpanel.darrell.nl/images/derma.png') 3 388 388 3 fill stretch stretch;
    height: 300px;
    width: 200px;
}