:focusでsafariのハイライトが超ジャマじゃね？
知ってる人は知っている。知らない人はちょっと幸せになるCSS3のテクニックを紹介。
CSSで:focusを使用してフォームを作ったとき、safariではちょっとマズいことが起こります。
safariには自動的にハイライト機能が働いて、青いボーダーが表示されます。
こんな感じで…ちょっと残念な感じですね。
これを、ナントカします！(｀・ω・´)
"CSS"に関連する記事
CSSのアレとか
画像を使わないでフォントをユニークに！
ユニークなフォントをWEBサイトに使いたい。WEBデザイナーさんならよくある事だと思います。
今までは、フォントサイトからダウンロードして、photoshopなどで画像化したものをWEBに上げていましたね。
これからはWEBフォントを利用するのが、一般的になるかもしれませんよ。
今回は、CSS初心者向けにWEBフォントを利用するためのデモ。
知ってる人は知っている、知らない人は知っててソンはないテクニックですw。
まるでPHOTOSHOPの様にグラデーションを作れるCSS ジェネレーター
これはマジで使える！Photoshopのようにグラデーションを作れるし、プリセットも秀逸。
タイムリーにプレビュー出来るので、視覚的にも分かりやすい。
できたグラデーションをCSS3のコードを取得して、自分のCSSファイルにコピーすればOK。
colorzilla Ultimate CSS Gradient Generator
対象ブラウザは、
- Firefox
- Safari
- Chrome (Webkit)
- Internet Explorer.
IEに対応しているのはうれしいですね。
CSS3が苦手な方は、マジ使っとけww。
CSS3をつかってアニメートするプログレスバーを作っちゃえば？
すっかり定着した感があるCSS3ですが、もうちょっとつっこんでjQueryのライブラリを利用して、アニメートするプログレスバーを作る方法をcatswhocode.comより紹介します。
まずはデモを。
CSS3のグラデーションをIE7.8でも使いたいからIEハックを書くんだ！
CSS3にはグラデーションというすばらしいプロパティがあるんですが、やっぱりIEはCSS3に対応していないのだな。
なので、CSS3のグラデーションをIE7や8にも適応させる為のIEハック。つぅか、IEってなに？頑なにCSS3を実装しない理由がわかんない。
Continue Reading »
IEでもCSS3を対応させたい時の対処法”ie-css3.htc”
以前にIEでも角丸と影をCSS3で表現したい！しかも簡単に！という記事を書きましたが、もうちょっとだけ簡単にするスクリプトがdesign-developさんにありましたので紹介。
たった１行追加するだけでOKの超簡単スクリプト。
角丸やシャドーなんかの、比較的良く使いそうな要素に対応しているんで、案件でIE6対応必須の時でも安心して使えそうですね。
スライドするフォームでコンバージョン向上！なjQuery
よくコンバージョンなんて言葉を聞くと思いますが、コンバージョンとは簡単に言うと目標設定のこと。
ECサイトのような商用サイトでは、会員登録や商品購入完了とかの目標のことですが、このコンバージョン率を上げる施策がサイト運営の要といってもいいかもしんない。
そんなコンバージョン率を上げることが出来るかもしれないjQueryライブラリを紹介です。
Continue Reading »
CSS3だけを使って画像を反射させるんだもん。
いままで、画像が反射したような表現はjavascriptのライブラリを使っていたと思いますけど、今回はCSS3だけで、画像の反射（リフレクション）を表現する方法を紹介します。
Continue Reading »