Webデザイン遅くなりましたが、あけましておめでとうございます。今年も何かしら書き綴っていきますよ。新年一発目は最近流行りのHover.cssの使い方をまとめてみます。Hover.cssダウンロードHover.cssからダウンロードとデモが見れます。実装方法hover.cssをリンクし、要素にbuttonと実装したいスタイルのクラス名を指定するだけです。#666666;}となってます。ここで1つ注意しなければいけないことが、すべてのスタイル名(growやshrinkなどなど)はインラインにスタイル変更されていることです。横並びにしやすいようにしてあるんだと思います。CSSを嗜む方なら理解できると思いますが、ブロック要素に指定する場合はもう一度ブロック要素に上書きする必要がありますね。ちなみに「a(インライン)」「div(ブロック)」「span(インライン)」でgrowを指定したサンプルを作りましたので参考にどうぞ。grow">GROW(span)</span>IEに関してIE10はほぼ対応していますがIE9以下はtransform等使ってますので崩れることはほぼありませんが動きは無視されます。IE6~7ははず恩恵はないと思っていいでしょうね。まとめ最近、サイトのグローバルメニューはシンプル且つ分かりやすい使いやすいをモットーにデザインしていましたが、何かワンポイント欲しいなと思ってみつけました。言うよりボクのgunosyで流れてきました。CSSが分かれば色変えたりサイズ指定したりしてグローバルメニュー等に配置ってのも簡単なんじゃないでしょうか。Licenseなので著作権表示をお忘れなく。Compass]WindowsでSassとCompassで環境作るときにあったエラーのメモやっとおじさんも時代のニューウェーブに乗るためにSass環境を整えてみました。環境を作るのは黒い画面を使いますけど難しくないですねー。...記事を読む[Sass,Compass,CSS]Sassの醍醐味Compassを使ってもっと楽しちゃおう!やっぱりSass使い始めたらCompassじゃないっすかねー知らんけど。世の中そんな流れだし実際すばらしいので記事にしちゃうわけよw...記事を読む[CSS]googleマップをレスポンシブに表示したい気付けば4月。今月また歳を取ります。いうわけで書こうと思ってて忘れていたネタを2年越しに思い出したので書きます。「今?!」...記事を読む[sass,css,メディアクエリ]sassでメディアクエリを書くときに簡単だなって思った方法スマホ対応、タブレット対応のWEBを作るときに使われるレスポンシブWEBデザイン。これはメディアクエリが必須となっています。背景画像を画面いっぱいに表示するよ!しかもjqueryでIE7、IE8も対応だよ!背景画像を画面いっぱいに広げるってーのはー男のマロン。栗は美味しいね下山です。Designer」を試してみた。Font]Webフォントを使って洒落たメニューをおっさんが作ってみる。WebFontって使ったことないなー。アイコン的に使ってみた。洒落たメニュー作ってみたよ。今回使ったのは「Fo...記事を読む[CSS3]transitionのまとメモ昨夜は会社で寝てました。「え?え?え?どこ?いつ?なんじ?」な状態です。最近頻繁に使うtransit...記事を読む商用利用OKの無料ピクトグラム最近WEBデザインにしろペーパーデザインにしろピクトグラムを使うことが多くなりました。Numbers」を使っている方も少なくないはず。...記事を読むスポンサーリンク2013年もありがとうございました。[CSS]text-shadowをIEでもやってみる。