css

ヘッダーにナビゲーションなどを固定するスタイルは最近良くみかけますよね。
私自身も何回か制作しました。
その時にちょっと手こずったのが、アンカーの位置がずれてしまうこと。

<div id="header"& ...

この要素ってIE７から対応だったけ？IE8からだっけ？
と迷うことがよくあるので個人的に良く使うcss要素とセレクタのIE対応を一覧にしてみました。個人的メモ。

A > BAの直下の子セレクタに適用する。子供セレク ...

フォーム内で使われるselect メニューで文字を大きくしたかったんだけど、ちょっととまどったのでメモとして。

文字サイズ変更はselect要素に設定してみるも変わらず。。。

select{font-size:14p ...

ウェブサイトでアイコンを使いたいときに、画像ではなく、Webフォントを使って表現することって多くなりました。
手軽だし、サイズが変わっても荒くならないのもいいですよね。

いろいろなWebフォントサービスがありますが ...

しばらく書くのをサボってしまいました–;

また今日から頑張ります。

やりたかったのはこんな感じのやつです。

一昔前なら、画像で表現していたと思うんですがスタイルシートでできるよなーと。

リスト、テーブルやカラムを並べるときに、:nth-child は大活躍の疑似クラス。

使い方の基本○番目のエレメントを指定する
※3番目の場合li:nth-child(3){color:red;} 奇数、偶数を指定する ...

コンテンツを効率的にレイアウトしたいときにタブを使ってレイアウトすることはよく有ります。

そんな時にCSS＋javascript で実装するサンプル

javascript は　Yetii (ちょっと古いけど使い ...

HP上にSNSの各ボタンを並べるのを今更ながらやってみたら、余分なスペースがあったり、ガタガタになってしまったので、今後きれいに横並びできるようにするための覚え書きです。

今回は、Twitter、Google+、Faceb ...

リンクをクリックしたときにでるまわりの点線？
IEやFirefoxで表示される。これを表示させたくない場合は

a{ outline:none; }

とすると消せるそうなんですが、tabキーを使ってリンクを移動している ...

アニメーションがなくても良い場合はcssだけドロップダウンメニュー作れます。

HTML

<ul class="nav"><li><a href="#">nav1</a> ...