CSS

Thumbnail of post image 159

たまに使う時になると思い出すのが大変なので、備忘録としてサンプルとともに。

共通css

.box{ position: relative; padding:20px; background:#ccc; width:5 ...

CSS

Thumbnail of post image 096

レスポンシブデザインが増えるにつれ使用頻度の多くなったbackground-size。
背景画像をレスポンシブ対応するときに活躍します。
今までぼんやりとした知識しかなかったので、ここらで勉強し直します。

...

CSS

Thumbnail of post image 197

ヘッダーやコンテンツ、フッターがあるサイトでコンテンツの中身が数行だったりするとフッターが宙に浮いた感じになってどうも見栄えが悪い時ってありますよね。
お問い合わせの送信完了ページとか。

そんな数行しか無いコンテン ...

CSS

Thumbnail of post image 114

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

<div id="header"& ...

CSS

Thumbnail of post image 066

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

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

CSS

Thumbnail of post image 169

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

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

select{font-size:14p ...

2022-05-15CSS

Thumbnail of post image 124

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

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

2015-06-01CSS

Thumbnail of post image 018

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

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

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

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

2022-05-11CSS

Thumbnail of post image 105

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

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

2022-05-15CSS

Thumbnail of post image 150

新たにホームページを制作するときに毎回悩むfont family の指定。
自分の理解が足りていないのが原因なのですが。
改めて調べてみてまとめます。

font familyの記述方法font-family: フ ...