按鈕在HTML/CSS

-3

我有以下按鈕：按鈕在HTML/CSS

enter image description here

我需要使用HTML/CSS3做到這一點。我已經嘗試了很多東西，如徑向漸變。

我已經試過-webkit-梯度（線性..和-webkit-梯度（徑向...

任何幫助或想法？

來源

2012-07-21 Tony

你可以給你試過的代碼嗎？此外，背景可能更容易與圖像做。 – 2012-07-21 19:08:33

爲什麼你需要*用CSS來做到這一點？ – Dennis 2012-07-21 19:09:14

我需要用CSS來做，因爲我們正在優化代碼，它需要更快。 – Tony 2012-07-21 19:09:47

-1

使用CSS，我能得到的最接近只是一個線性漸變，從上到下，底部的一點點光線很難做到CSS，你可能需要考慮一個圖像，如果它不是很大，不會影響性能太多，

你可能會想要看你的服務器端編碼的性能，因爲這是大多數時候的問題。如果這是因爲你需要加載大量的圖像，你可以得到所有的ima ges放在你的網站上，並把它放在一個文件中，並且總是得到那個文件，但是具有不同的背景位置。 StackOverflow也使用它。這種技術被稱爲使用sprites

指南在做什麼，它是如何工作可以在這裏找到：CSS Tricks: Sprites。

這是我得到的最接近：http://jsfiddle.net/DU3QJ/

來源

2012-07-21 19:28:27

Here's an attempt at it:

div { 
    background-image:-moz-radial-gradient(50% 100%, yellow, #FFCC00, yellow); 
    background-image:-webkit-radial-gradient(50% 100%, yellow, #FFCC00, yellow); 
    background-image: radial-gradient(50% 100%, yellow, #FFCC00, yellow); 
    height:47px; 
    width:202px; 
    border-radius:5px; 
    text-align:center; 
    line-height:47px; 
    font-weight:bold; 
    font-family: sans-serif; 
    color:#AA8100; 
}

來源

2012-07-21 19:28:37 Dennis

徑向漸變只用圓形或橢圓形，所以你將無法得到這種風格沒有圖像或一些CSS畫布...

來源

2012-07-22 00:00:58

回答

相關問題