Home > CSS

CSS Archive

[ CSS ] IE で垂直マージンが相殺できないバグ

Internet Explorer は width 指定があると、垂直マージンが相殺できないみたい。

Continue reading

[ CSS ] Internet Explorer で見出しの文字が欠ける場合の対処法

HTML の一番上に h1 要素を書いて、CSS で、

body { line-height: 150%; }

と言った記述をすると、Windows Internet Explorer 7 で見出しの文字が欠けてしまいます。

IE7 スナップショット

こんな感じ。

Continue reading

CSS を複数ファイルに分割する時のファイル名

CSS を複数ファイルに分割して管理する時のファイル名を考え中。みんな、どんなファイル名を使ってるんだろう?調べてみたい。

Continue reading

[ CSS ] よく使う id, class 名の覚え書き

CSS を書いている時、id, class 名を決めるとき悩む事が多いので、忘れっぽい自分の為に覚え書き。

Continue reading

[ CSS ] 10px を基準にしてフォントサイズを指定する

さっき書いたエントリー の応用で、デフォルトフォントサイズを 10 ピクセルにし、

font-size:10px → font-size:100% or font-size:1.0em
font-size:12px → font-size:120% or font-size:1.2em
font-size:14px → font-size:140% or font-size:1.4em
font-size:16px → font-size:160% or font-size:1.6em
font-size:18px → font-size:180% or font-size:1.8em

と指定できると簡単かなぁと思い、サンプルを作ってみました。

Continue reading

[ CSS ] フォントサイズを統一&サイズ変更できる指定方法

本文を 12 ピクセル相当の大きさで表示すべく、font-size:75%; で指定されたページを Mac Firefox 2.0 で見ると文字が小さく見えます。

これは、Mac Firefox 2.0 のデフォルトフォントサイズが 14 ピクセルの為で、計算してみると 10.5 ピクセル相当の大きさでレンダリングされている事になります。

14px * 75% = 10.5px

確かに小さいですねー。

Continue reading

[ CSS ] キャプション付き画像に本文を回り込ませるサンプル

キャプション付き画像に本文を回り込ませる CSS のサンプルを書いてみた。

こんな書き方で正解なんだろうか?

[ CSS ] CSS ハック ( Hack ) のまとめ

CSS ハックと言うものを使うと、特定のブラウザだけにスタイルを適用したり、バグを回避したりできるみたいなので、その方法をメモ。

Continue reading

CSS の position を使ったレイアウト

CSS の position プロパティを使ったレイアウトをお勉強中です。

この方法の利点は、HTML の出現順に左右されないレイアウトができる所です。例えば、HTML の末尾に書いた内容をページの一番上に配置することができます。

以下、簡単にまとめてみました。間違ってたらゴメンナサイ。

プロパティのキーワードについて

キーワード 意味 配置位置
absolute 絶対配置 直前(上位)ブロック要素の左上を基点に絶対配置
relative 相対配置 通常の出現位置(ソース上で書かれた所)を基点に相対配置
static 通常配置 通常の出現位置(ソース上で書かれた所)を基点に通常配置
fixed 固定配置 ブラウザの左上を基点に固定配置(スクロールの影響を受けない)

最後にソースの書き方によって、基点がどう変わるかの サンプル です。

CSS でテキストを回り込ませる

CSS でテキストを回り込ませるサンプルを作ってみました。

こんな書き方で良いのかなぁ。

Mac Internet Explorer 5.2, Mac Firefox 2.0, Mac Safari 2.0 で表示確認。

Page 2 of 6«12345»...Last »

Home > CSS

タグクラウド

Return to page top