はてなはてな黙示録（その１１）

少しばかり、ガイドグループを見直して来ました。
そこで私は確信しました。
ようするに、スタイルシートというのは、「セレクタ」を発見し、そこを自分色に染め上げる作業です。（恥ずかし……）
私は、どうしてもHTMLとスタイルシートの差がピンと来ないでいるのですが、その理由もはっきりしました。
ようするに、両方とも知らないわけですから、その差を理解することも不可能なのです。
なので、まず「スタイルシート」か「HTML」のどちらかをしっかりと身につけるのが大事だと悟りました。
そうすれば、分かっている方が一つの基準となって、それがどちらのことなのか判然とするはずです。
判然とすればレッテルを貼れますので、内容はともかくせめて分類は出来るということになります。
書く端から、「そんな簡単に行くわけが無い」とか思っていて我がことながら感じが悪いですが、これも一つの基準です。ダメなら放棄して忘れたフリをすれば良いだけですから、内緒にしておきましょう。


前回は、「pre要素」を「引用」とやってしまい一人大騒ぎをしました。
こういうのは、「初心者らしい可愛い間違い！」というのとは完全に違って、「なまじ囓ったゆえの早とちり、つまりは過信」というあってはならねぇしろものです。正直、やつあたりで犬にコーヒーを舐めさせている場合じゃありません。自分に猛省を促しておきました。果たして効果はあるでしょうか？　正直、疑問です。
まぁ、そんなことはさておき、何から始めましょうか。
まずは、「整形」と「引用」の問題にカタを付けることにしましょうか。


超基本的なところに立ち返ります。
はてなダイアリーの日記編集画面にある、「詳しい入力ルール」によると、「整形」する箇所を示すタグは「＞＜pre＞〜＜/pre＞＜」です。
これと同様に、「引用」を行う箇所を示すタグは「＞＜blockquote＞〜＜/blockquote＞＜」となっています。
これはおそらく、「html」に準拠した書き方なのだと推測するのですが、まぁ想像の埒は切れません。

pre {
background-color: #e7ebff;
padding: 8px;
}

これが、スタイルシートで「pre」、すなわち「整形」した部分を装飾する記述です。これは、他の人の書いたテキストからなので信用できます。
ということは、この原則をそのまま適用すると。

blockquote {
background-color: #e7ebff;
padding: 8px;
}

という記述をすれば、「＞＞」「＜＜」でくくった文章が、変化してもおかしく無いはずです。
とりあえず、テーマを切って実験してみましょう。設定画面に入り、「テーマ」を「設定しない」にします。
そして、上の記述をスタイルシートの欄にコピーして……
（えい！）
おぉ、がっつりと変わっている。なんだか、拍子抜けするくらい簡単でした。
なんだか行間が開いていて、すごいことになっていますが……
まぁ、すぐに自分が気に入った状態になりっこないですし、できないところが面白いわけです。
しかし、このままではテーマ「Hatena」の「整形」の処理と同じことを「引用」で行っているということになります。別に大した問題では無さそうですが、他ならぬ自分が混乱しそうなので、ちょっと書き直します。

blockquote{
padding: 8px;
border: 1px #0000ff solid;
}

とりあえず、実力目一杯の記述。
（おりゃ！）


………………


気に入りません……