0

このメニュー構造に基づいて:

メニューシステム

私は純粋に CSS ベースのメニュー システムを使用したいのですが、「ホーム」と「会社概要」に基づいて青色のジェル 2D ボタンの外観を得るには、どのようにアプローチするのが最適なのかわかりません。

基本的に、このボタンの外観を実現し、CSS でこの背景ボタンを使用して、html/css 経由でラベルを追加できるようにする方法を知りたいです。

これは可能ですか？

これを達成するためのチュートリアルの例は大歓迎です。Photoshop にもアクセスできます。

ありがとう。

4

1 に答える 1

1

したがって、ここにマルチパートの答えがあります：

あなたが話しているボタンのデザインは、グラフィック自体で行われます（したがって、本当に技術的にしたい場合は、完全に純粋な css ではありません）「宝石のような光沢のある外観」を作成する方法の例は次のとおりです 。 .info/photoshop/web-20-style-buttons/ 好み の外観に簡単に変更できます。また、Photoshop を使用せずに宝石で飾られた Web 2.0 のようなボタン (私はその用語が嫌いです!) を作成するサイトがいくつかあることにも注意してください。「web 2.0 ボタン ジェネレーター」をググってください。

簡単にするために、ネストされたを使用していると仮定します

  • メニューを実現するためのタグ。適切なリスト項目の背景を画像に繰り返しなしで設定し、高さと幅を画像自体に合う正しいサイズに設定するだけです。ほら、現在持っているcssスタイルの背景の代わりに背景の画像。

    スプライトを使用して読み込みを高速化し、応答時間を短縮することで改善されます。詳細については、こちらをご覧ください: http://www.smashingmagazine.com/2009/04/27/the-mystery-of-css-sprites-techniques-tools-and-tutorials/

    さて、そうは言っても、多くの人がこの問題を正面から攻撃しており、本質的にあなたのために行われる本当にエレガントなソリューションがいくつかあります. Smashing などのサイトを調べて、役立つ既製のソリューションを探すことを検討してください。個人的には、スーパーサッカーと、Jquery が提供するサッカーフィッシュ タイプのメニューの大ファンです。その道を行くか行かないかは、もちろん個人の好みです。

    幸運を。

    • 于 2010-07-12T16:24:47.207 に答える