CSS Beauty の中の人が選ぶ 2005 年度の CSS テクニック TOP 12

- My Top 12 CSS Articles/Tricks of 2005 (one for each month):
  http://www.cssbeauty.com/skillshare/comments.php?DiscussionID=11&page=1

  あとで，ちゃんとチェック．

IE で div の高さを 1px にする方法

  http://fumika.jp/nikki/2005/07/ie-div-height-1px

- via: 福メモ
  http://www.fukulog.com/memo/2005-10-18-2.html

<div style="width: 100%; height: 1px; background-color: red; overflow: hidden;"></div>

  overflow: hidden; がポイント．

FLASH に頼らない CSS で出来る伸びるグラフ

  http://codeweb.seesaa.net/article/7790669.html

  なるほど．見た目も綺麗で大変よろし．
  なにかに使えるかな．

「折り返す」pre

  http://sho.tdiary.net/20050922.html#p02

  各ブラウザで拡張してあるみたい．覚えておくと便利かも．

white-space: -moz-pre-wrap; /* Mozilla */
white-space: -pre-wrap;     /* Opera 4-6 */
white-space: -o-pre-wrap;   /* Opera 7 */
white-space: pre-wrap;      /* CSS3 */
word-wrap: break-word;      /* IE 5.5+ */

スタイルシートによる崩れない 2 カラム 3 カラム・レイアウト

  http://desperadoes.biz/style/dan/index.php

  ここは，なかなか分かりやすかった．

各ブラウザのスタイルシートのレンダリングの初期状態をリセットする

- リストの扱いの差:
  http://hail2u.net/blog/webdesign/css_tips_3.html

  クリエイティブ・コモンズ・ライセンスで，レンダリングの初期状態をリセットする common.css が公開されている．
  なるべく初期状態を一緒にして，楽をしようということ．
  全称セレクタを使ってブラウザのデフォルトスタイルを消してしまっておくというのと似たアプローチ．

訪問済みリンクを一工夫する

  http://www.lucky-bag.com/archives/2005/09/visited_link.html

  訪問済みリンクを画像で表示する．
  a:link，a:hover，a:visited で一つの背景画像の位置を変えて表示する．

CSS を作成する際のお約束

  http://www.lucky-bag.com/archives/2005/08/default_style.html

* {
     margin: 0;
     padding: 0;
     font-style: normal;
     font-weight: normal;
  }

  何はともあれ，全称セレクタを使ってブラウザのデフォルトスタイルを消してしまっておく．

プログレスバーの進行度を CSS で表現する

  http://www.lucky-bag.com/archives/2005/07/progress_bar.html

  CSS でプログレスバーを表現する．
  元記事では，表現だけしていたので (ちょっと変だけど) JavaScript で動くようにしてみた ．

  プログレスバーの進行度を CSS で表現する

class="red large" のように、2 つ以上の適用クラスを並べられる

  http://e8y.net/blog/?p=124&more=1&c=1

<style type="text/css">
<!--
.red { color: red; }
.large { font-size: large; }
-->
</style>

<span class="red large">大赤字</span>

  ってな事ができるらしい．全く知りませんでした．これは結構便利かも．ルールは，

o 適用クラスを半角スペースで区切って複数指定できる
o id 属性ではそれはできない
o 値は左から順にカスケードして適用されていく