選択/選択解除を示すCSSボタンスタイル？

Question

私は、トグル可能なボタンのセットを作成するためにCSSを使用しています。

私はほとんどそこだけど、私は、私はかなり右CSSのproprertiesを持って感じることはありません：

http://jsfiddle.net/rrGab/5/は、私が選択したボタンの濃い境界線が暗すぎる、あまりにも急激線引きだと思うが、私それをよりスムーズに見えるようにする方法を知らない。

誰かがCSSを見栄え良くするために改善する方法を提案できますか？

私は、ボタンをページから「ポップ」させる、またはその中にくぼんだように見せるという一般的なCSSの原則を知りたいです。

StackOverflowがこれに適していない場合は申し訳ありません。より適切な場合は、デザインフォーラムに移動してください。

Answer 1

凹凸のある「活字」エフェクトの場合は、2つの異なる色の枠線が必要です.1つは上端、もう1つは中実の枠線ではなく、下に配置します。この記事hereを参照してください。このテクニックではテキストシャドーを使ってテキストでエフェクトを作成していますが、その背後にある哲学を使用して境界線の色に適用できると思います。

私は実線の境界線が本当にポップにならないことに同意します。 2トーンの境界線をもう一度行いますが、グラデーションが上に生成する「ミドルカラー」を使用し、下の境界線がグラデーションのボトムよりわずかに暗い場合はどうなりますか？