四箱問題のようなオモチャがあると（自分で作ったんだが）「どうすれば人を騙せるか^^？ 変わったCSSはできないかー 悪い子、泣く子はおらんかー」と、そればっかり考えてしまいブロガーとしての本業（何？）がオロソカになるので、この辺でまとめておきます。
あーでもないこーでもないと考えたレイアウトは問題が解かれたらハイそれまでョ、でしょうか。テクニック（と呼べるほどのものではありませんが）は実際のWEBページにフィードバックして、ナンボだと思います。考察する時に、HTML側がこうだったら、とか画数合って
るのか？などの心配を払拭するために作成しました。
FC2テンプレ編集画面のミニミニ版のようなものです。出来上がりスタイルの保存や、ページ丸ごとプレビュは無理だけど、メニューリスト・コメント投稿フォームなどのパーツ部分のHTML&CSSをちょこっと試めしてみる時に使ってください。
エディタなどでファイルを編集するには<main>〜</main>（表示部）の中身はHTMLで記述し、ふたつの<textarea>〜</textarea>の中身は、実体参照で記述してください。実体参照にはソースコンブが便利です（CMでした）。
初期設定ではリストが入ってます。ルールで使われた構造<div id="main"><div id="hoge"><span>は、それぞれ<ul id="menu"><li id="hoge"><a>のようなメニューリストに置き換えて考えることができます。
抽象的な<div>（箱）でレイアウトを実現して、それをHTMLの似た構造部に当ててみる――当初はCSSデザインそのものとHTMLのリスト構造の文章とが無関係である――というのも逆説的にWEB標準と言えるのではないか、と思います。
< 四箱問題 | ”TRICK劇場版2”を観た > | 表紙へ戻る |
このメニューの良いところは文字サイズ可変なこと、悪いところは長い文字列が使えないことです。
テキトーに作ったサンプルページですけど、結構気に入ってます。次のベースにすっか（ネタ日記にはにあわん？）-06日19時