具有可變高度

Question

滑動門按鈕我需要使用this image作爲一個按鈕背景：

按鈕應該具有動態寬度，如果我使用sliding door技術，該技術是沒有問題的。但是，如果仔細觀察圖像：頂部和底部邊緣有點彎曲，所以它不起作用。

我試圖拉伸圖像，但邊緣變得模糊。

有人知道這個問題的解決方案嗎？
任何想法表示讚賞！

編輯：
一些網頁已經有固定寬度/高度和他們每個人的「個人」的背景幾個按鈕：讓他們目光敏銳。如果我在「我的」按鈕上使用圖像拉伸技術，那麼它們之間會有對比，因爲它不會看起來那麼尖銳。

Answer 1

是的，你可以用CSS做， ，你可以保持形象，如果你wouldto做到這一點：

button{ 
    height:50px; 
    background-image:url("http://i.stack.imgur.com/lswk4.png"); 
    background-size: 100% 100%; 
    border: none; 
} 

Answer 2

試試這個：

div{ 
    height:50px; 
} 
div img { 
    position: relative; 
    width: 100%; 
    height: auto; 
} 

<div><img src="http://i.stack.imgur.com/lswk4.png" /></div> 

例子：http://jsfiddle.net/Q8f9t/4/