日記
418 メモ
- 投稿者 首領
- 投稿日 2002年06月30日 16時27分
- とりあえず、サイト全体の構成を考える。
- サイトの構成を紙に書いてみる。
- 好かったら、Adobe Illustrator で各ページのレイアウト案を作る。
- この際、なるべくCSSで可能かどうかなんて考えないようにする。
- と言いつつつも、出来そうもないレイアウトは避けてたりする。
- プリントしてみる。
- 好かったら、レイアウトのことは考えずにマークアップを開始する。
- と言いつつも、複雑そうな時は、ISO-HTML は避けてたりする。
- 同一レイアウトのリソースが 1 つ出来た時点で、CSS の作成作業に入る。
- とりあえず正しそうな CSS2 で書いてみる。
- 書いてる途中で div が足りなくなったりする。迷わず補充する。
- とにかく確認だと言うことで、MacIE5.x で閲覧してみる。
- div や span を補充し、class 名 id 名で悩む。
- 予想通りで無い部分の CSS を修正する。
- Mozilla でも確認してみる。大概、修正する部分は少ない。
- Win IE5 〜 6 で確認してみる。
- たくさん補正箇所が出てきたり、バグなのか、再現しない現象が出たり。
- 補正用 CSS を書いたり、Win IE だけレイアウトを変更したり。
- Opera で閲覧する。
- 補正用CSSを書く。出来そうもない部分は諦めて放置する。
- 同一レイアウトの他のリソースをコピペしながら作る。
メモメモ。
<link rel="stylesheet" media="screen,tv" href="common/common.css" type="text/css" title="基本用">
<link rel="stylesheet" media="screen,tv" href="common/opera.css" type="text/css" title="Opera用">
<!-- [if IE 5 ]><link rel="stylesheet" type="text/css" href="common/win_ie5.css"><![endif]-->
<!--[if gte IE 5.5000 ]><link rel="stylesheet" type="text/css" href="common/win_ie55.css"><![endif]-->
<!--[if gte IE 5 ]><link rel="stylesheet" type="text/css" href="common/win_ie5to6.css"><![endif]-->
common.css には、MacIE5 、Mozilla 、WinIE5〜6 、Opera 、共通のスタイルを書く。Opera 用スタイルシートは、link rel="stylesheet" で title を基本スタイルと変えて Mozilla が読み込まないようにして、opera.css には、@import url('_opera.css') screen ; と書いて、WinIE5 〜 6、MacIE5 が読み込まないようにする。で、import 先の _opera.css に Opera 用の補正を記述すると。WinIE 用には、<!--[if IE 5 ]> WinIE5 だけに読み込ませる補正スタイル、<!--[if gte IE 5.5000 ]> WinIE5.5 以上に読み込ませる補正スタイル、<!--[if gte IE 5 ]> WinIE5 以上に読み込ませる補正スタイル、の 3 つを作って、完成と。
なんだかなー。
はてなブックマークのコメント一覧
←クリックしてみそ。（フラグメント識別子あり）- ←クリックしてみそ。（フラグメント識別子なし）