はてなはてな黙示録(その6)

土・日はスタイルシートの日です。
これを書いているのは日曜日なのですが、まるで土曜日のような気持ちで書くような気でいます。
これを日曜日の分として書けばいいのではないかと言われるのは重々承知なのですが、そうはいきません。私は、日曜日の分のテキストを書くのをとても楽しみにしているのです。
だったら日程どおりに書けという話になるのですが、そうとも行きませんでした。
金曜日・(超スケジュールタイト 明け方帰宅)→土曜日(9時起床・入浴直後出発・飯田橋で牌と戯れる・23時帰宅・金曜日の日記を書く)→日曜日(起床・金曜日の日記アップ・すごく楽しく人様の日記を読む・人に会う・間にビール数本)→そして今にいたる
その間、何か実になることをやるための時間は、数分たりとも無かったと断言できます。
大忙しです。アホとか言わないでください。本当のことを言われると、人間怒ります。分かってるんです。


というわけで、現在使用中のテキストは、yms-zun様の「CSS再構築」。今日は「ちょいと横道です」からです。
(大和但馬屋日記 CSS再構築(ちよいと横道)


最近ちょっと調子いいなと思っていたのですが、こういう時は必ずガツンとやられると相場が決まっています。
それで、この横道がそう。入り組んでいて迷子になります。

いきなり瑣末な設定になるが、スタイルシートの記述部分が本文の説明と同じスタイルで並んでゐるとどうも見づらいので、ここを本文と分けて表示する様にしたい。この部分は"source"といふクラス名のpre要素でマークアップしてゐるので、次の記述を追加。

ここでまずつまづいています。
えーと、どういう意味なんでしょう。
確かに「source」というクラス名は分かりません。「pre要素でマークアップ」も分かりませんが、これは固有名詞に頭をぶつけているだけかと。それ以前に文意が今ひとつピンと…… 来ないなぁ……
まぁ、とりあえず「マークアップ」にキーワードリンクがあるので、それを見に行ってきます。
(もしもし)

マークアップ
プレーンテキストにタグをつけて、機械(コンピュータ)にも情報を理解出来るようにすること。変な形の場合は、「不思議マークアップ」というような言いかたでいちゃもんをつける人間もけっこう多い。

「不思議マークアップ」の実例が無いので、これは分かりません。が、ようするに私が今やっているように、「ワードパッド」にテキストを書いて、それにタグを書いて日記入力画面に流し込むという一連の作業中、「タグを書く」という部分がマークアップでしょうか。
ついでに「pre要素」も調べておきましょう。
(pre)
そういえば、この<pre>は以前に「はてなダイアリーのヘルプ」で見たような記憶もあります。
あぁ、「>|」「|<」で行う整形の時にやったのでした。
ということはですよ、

pre.source {
border:1px #999 dashed ; /* 枠線の設定 */
padding:2em ; /* 枠の内側の余白設定 */
line-height:1.2em ; /* 行の高さの設定 */
font-size:80% ; /*フォントの大きさの設定*/
overflow:scroll ; /* はみ出したらスクロール */
}

これは、いわゆる「整形済みのテキスト」がどのように表示されるか、ということを示しているのでしょうか。
ということは、

スタイルシートに記述する部分」が、本文と同じサイズの文字で並んでいると見づらいので、
ここを一目で別のものと分かる形で表示するようにしたい。これを行うには、「>|」「|<」
を利用して整形すれば良いのだが、これは「pre要素」の「source」というクラス名で指定
することができる。

と、こう書いてあるわけか。
読めば読むほど、そう書いてあります。いくらなんでも、ものわかり悪すぎです、自分。
ようは、「サンプル文書4」と「テキストの本文」を見比べれば一目で分かるということなんですね。
整形された文章は、字が小さくなって枠線の内側で内寄せされています。これが、上の「pre.source」の仕業というわけですか。


さて、上記の中で未出のものは「overflow」というセレクタです。
それに関してはこのような記述が。

pre要素内のコンテンツは枠をはみ出す長さになつてもお構ひなしにぶつちぎってくれるので、はみ出し対策にスクロールバーを出してみた。‥‥ところが、InternetExplorerの表示を見てビックリ。そ・れ・は・意味が違ふだろ! こんなローカルなブラウザはさつさと捨ててしまへ。

そうなんです。昔、テキストを「整形」して日記を登録したら、本来2行になるべき文章が1行のままはるか画面外に消えて行くという現象が起きたことがありました。その時は、自分で改行して用を足したのですが、少しムッとしました。あれは、このことっぽいです。
そうか、そうなって当たり前なのか。納得。ただ、どう「意味が違ふ」のかはキッパリ分かりません。
(しかし、「out look」に「InternetExplorer」という編成なので、なんだか肩身が狭いです……)


ところで(突然ですが)、上の「pre」の解説は旧かなづかいに旧字が使用されているのですが、これはネットの解説テキストとして一般的な記述法なのでしょうか。そうでないとは思うのですが、そうでないという確信もありません。困りはしないのですが、困った。