關於圖像中心和響應的文本

Question

我想使用html和css製作這樣的文本。並能夠響應式網站，並查看關於IE8

enter code here 

<a class="btnSubmit"> 
<img src="btnSubmit.png"> 
<span>Submit</span> 
</a> 

Answer 1

由於G.L.P的評論suggets可以使用CSS gradients讓後臺工作。

對於「響應式網頁」按鈕，您可以查看以％值設置寬度，這會相對於網頁縮放。

Here's一個很好的解釋，使用什麼，以及何時使用它

嘗試是這樣的：

HTML：

<button>Submit</button> 

CSS：

button { 
    width:30%; 
    background: -webkit-linear-gradient(grey, white); /* For Safari 5.1 to 6.0 */ 
    background: -moz-linear-gradient(grey, white);/* For Opera 11.1 to 12.0 */ 
    background: -o-linear-gradient(grey, white);/* For Firefox 3.6 to 15 */ 
    background: linear-gradient(grey, white); /* Standard syntax */ 
} 

查看fiddle以查看此代碼的執行情況