[CSS]シンプルなHTMLで角丸のタブをより美しく実装するチュートリアル
画像を使用せずに、リスト要素で実装したシンプルなHTMLで角丸のタブをより美しく実装するチュートリアルを紹介します。 (Better) Tabs with Round Out Borders [ad#ad-2] 下記は各ポイントを意訳したものです。 デモ 実装 デモ デモはChrome, Safari, Firefox, Operaでご覧ください。 IEはたぶんIE10で対応するはずです。 デモページ 実装 まずは、HTMLから。 HTML タブをシンプルなリスト要素で実装します。 <ul class="tabrow"> <li>Lorem</li> <li>Ipsum</li> <li class="selected">Sit amet</li> <li>Consectetur adipisicing</li> </ul> [ad#ad-2] CSS CSSの実装は、少しずつキャプチャと
IEでも動作する画像を超簡単に角丸化できるjQueryプラグイン「IMGr」:phpspot開発日誌
IMGr :: jQuery Image Rounder IEでも動作する画像を超簡単に角丸化できるjQueryプラグイン「IMGr」 $("imageElement").imgr(); と唱えるだけでクロスブラウザで画像の角を丸くすることが可能です。 $("imageElement").imgr( optoins ); でradiusやサイズ、色のカスタマイズが可能。 赤いボーダーで角丸の例 ボーダーを消した例 四方の角丸の操作も自由自在です。 IE 6, IE 7, IE 8, FF 3.6, Chrome 6.0, Safari 5.0, Opera 10.62 のブラウザ上でテストされているそうです。 関連エントリ CSSで角丸テクニック２５ 角丸を使った可愛いカレンダーピッカー実装JavaScript「jsDatePick」 CSS3で影付き角丸グラデーション付きのボタンを作成す
jQueryを使って簡単に角丸を作れるjQuery curvyCorners | バシャログ。
最近、jQueryにハマっているishidaです。 CSSコーディングで角丸処理をする場合、たいていは上下の角丸部分を画像として切り出して、そんでもって背景画像を適用してという風にします。 また最近では、角丸を作るjavascriptライブラリーなどがあります。 でもdiv要素が増えたり、なんだかソースがすきっりしないぜぇ～と思っていましたがイイものがありました。 私がハマっているjQueryで角丸をつくるjQuery curvyCorners。 jQuery curvyCornersサンプル まずjQueryサイトからjquery-1.2.1.pack.jsファイルを入手。次に jQuery curvyCornersサイトからjquery.curvycorners.packed.jsファイルを入手。 使いかた まず、上記で入手したjsファイルをインクルード。 <script src="j
Do You Need A Blog Afterall? - Blue Anvil
Unless you have been under a rock these past 3 or 4 years than you absolutely have heard about how critical a blog is to your website and your business. You’ve heard that it will pull in targeted, interested traffic that converts. You’ve heard that it will help you build a brand and a reputation for yourself that is unparalleled and more importantly, irreplaceable. You’ve heard that it is the key
角丸を表現する「jQuery Corners 0.3」
角丸を表現する「jQuery Corners 0.3」 Check Tweet 配布元：jQuery Corners 0.3 ライセンス：MITとGPL jQuery Corners 0.3はブロックレベル要素やボタンを角丸に変更するJavaScriptライブラリです。 jQuery Corners 0.3の使い方 まずはダウンロードしたjQueryのファイルとjquery.corners.jsをhead要素などで読み込みます。 <script type="text/javascript" src="../js/jquery.js"></script> <script type="text/javascript" src="jquery.corners.js"></script> 次にscript要素で角丸の設定を行います。角丸にしたい要素をCSSセレクタで指定します。 <script t
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
web制作関連ジェネレーター - ブックマーク - Tips - AZ store
