CSS(スタイルシート)の基本、小技、テクニック総まとめ

6
months
27
配信元サイト
Webpark

CSSの基本や使える小技テクニックなどを幅広くまとめました。以前書いて今もそこそこアクセスがある「CSSの知識をもっと深める30+2の小技テクニック集|Webpark」という記事があるのですが、2年近く前の記事ですしパワーアップさせて作り直しました。

  • このエントリーをはてなブックマークに追加
  • いいね!
  • google+
  • evernote

COMMENT

以下の内容でCSSのテクニックを紹介されています。
webページ制作はこちらの知識でほぼまかなえるのではないでしょうか。

1. 全般的なこと

  1. CSSリセット
  2. 複数のクラスを指定する
  3. IE用簡単CSSハック

2. まとめて書けるプロパティ

  1. border
  2. background
  3. font
  4. padding、margin
  5. ul、ol、li

3. セレクタに関すること

  1. 最初に現れる文字にだけスタイルを適用する
  2. 最初の行にだけスタイルを適用する
  3. 最初に現れる要素にだけ適用する
  4. n番目に現れる要素に適用する

4. テキストに関すること

  1. 文章内の最初の文字を1文字下げる
  2. 2行目以降の文字を1文字下げる
  3. 長い単語やURLを途中で折り返す
  4. 長い単語やURLの表示を途中でやめる
  5. 単語を途中で折り返さない

4. 小技テクニックいろいろ

  1. divを中央揃えにする
  2. 上下中央揃えに表示する
  3. 高さの違うボックスをきれいにそろえる
  4. 最低限表示する高さを指定
  5. hrに背景画像を使う
  6. 画像の下に文字を回り込ませない
  7. リストの一番上の線を消す
  8. リストのリンクを押しやすくする
  9. リストを使った横並びメニュー
  10. 色の違うボーダーの境目をきれいに見せる
  11. 画像を使わずに吹き出しを作る
  12. HタグとPタグを横並びに表示する
  13. リスト以外の要素をカウントする
  14. clearfixで回り込みを解除