『Dezinerfolio流』自動的に横幅を調節してくれるCSSタブメニューの作り方*ホームページを作る人のネタ帳
いつも購読している海外のブログ記事ですが、図つきでわかりやすく紹介されています。 こういうのは過去にもいくつか見た事がありますので『Dezinerfolio流』と名づけておきます。 ようするにCSSタブメニューの横幅を、中に書かれたテキストによって、自動的に幅を調整すると言うもの。 タブメニューは結構使うようになってきたので覚えておいて損はないですよね。 もうタブの画像生成に悩まない 実際タブメニューは結構使いますので、これでひとつまた作業が楽になります。 タブの画像も、海外では無数に配布されていたり、生成できたりしますので、利用頻度は高いかと。 サンプルはこちら 図つきのため本当にわかりやすくなっています。 ソースコードはエントリに書かれていますので、そちらを参考にしてください。 Creating Liquid CSS Tabs for Menus もしもタブを作るのがそもそも面倒なら・
CSSタブ・ナビゲーション / ウェブデザインライブラリー
投稿日：2006年12月26日 レベル：初心者 ソフトウェア： ここでは、リストとCSSを用いてナビゲーション用のタブを作ってみましょう。 Step1 ： タブ用CSS Step2 ： <div>タグで挟む <style type="text/css"> #tabs{ padding:0; margin:0; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#FFF; font-weight:bold; } #tabs ul{ list-style:none; margin:0; padding:0; } #tabs ul li{ display:inline; margin:0; text-transform:capitalize; } #tabs ul li a{ padding:5px 16px
知っておいて損はないAJAXやCSSを駆使したタブインターフェース18種類 - GIGAZINE
技術的知識が無くてもタブを作れるフリーソフトからかなり派手な効果を伴うタブ作成ライブラリ、Yahoo！やGoogle、Adobeの作ったタブまで、いろいろと応用が利いて独自の特徴があるものをざっくりと18種類ほどピックアップしてみました。 いろいろなページやブログで頻繁に見かけるタブ方式のメニューですが、こうやって並べてみると実は見せ方も使い方も種々様々であることがよくわかります。 まずは知識不要でタブが簡単に作成できる「CSS Tab Designer」。Windows用のフリーソフトで、約60種類ものデザインが用意されています。その中にタブ方式のメニューもたくさん用意されており、ほかにも縦型のメニューやZDNet風メニューなども用意されています。 OverZone Software - CSS Tab Designer 細かいカスタマイズが可能なタブメニュー。画像を使ったサンプルも用意
CSSでクールなタブUIを作成するサンプル:phpspot開発日誌
OSResources - How to create CSS overlapping tabs? Sometimes simulating a real desktop interface for your web application can be a real challenge, especially when dealing with tabs. CSSでクールなタブUIを作成するサンプル。 次のようなタブUIを作ることが出来ます。 サンプルのCSSを定義しておけば、後は次のようにシンプルなHTMLをコーディングするだけで上記画像のようなタブUIが作れます。 HTMLもクリーン。 <ul class="obtabs"> <li class="first"><span><a href="#">Jack</a></span></li> <li><span><a class="new
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://www.cssjuice.com/25-rounded-corners-techniques-with-css/