結論：<code>～</code>使う。
「<pre><code>無改行一行め～最終行無改行</code<>/pre>」を墨守すりゃよさげ。
<start-frame>,<end-frame>,<option>上記はこんな風に書いた。
<pre><code>＆lt；start-frame＆gt；,＆lt；end-frame＆gt；,＆lt；option＆gt；</code></pre>なお、上記の＆lt；は実際には半角英数（実態参照）で書く必要があるます。
長いものは<pre>と<code>の直後や、</code></pre>の直前などで改行を打ちたくなるのだが、それやるとpreタグ内部に改行が反映され、上下に間のびする。てゆうかその為のpreタグですわな。
<start-frame>,<end-frame>,<option>
<start-frame>,<end-frame>,<option>
Firefox 2、Opera 9とも意図通りの表示になるが、Safari 2のみ、上記いずれも「,,」だけを表示する。
1. は＜だけ実態参照（＆lt；）、にして、後ろは（＞）のまま。
2. は後ろのとんがり括弧＞も＆gt；にしたもの。
ちなみに、＜と＞を実態参照にせずそのまま書くとFirefox 2, Safari 2, Opera 9とも「,,」だけ表示になったが、Opera だけそれ以降の表示に不具合が出た。タグが閉じてないぢゃないかと怒っているらしい。見逃してくれよん…そんなタグあんのかな？
Opera向け実験。
<start-frame>,<end-frame>,<option>
</option>,</end-frame>,</start-frame>などと閉じてもだめぽい。ここから下のエリアがごそっと消える。かつ「,,」もワンセットしか出ない。他は２セット出るのだが。いや出たからどうだというもんでもないが。
まとめ：
preタグの中でもhtmlタグは解釈される。参考リンク
jmblog.jp - ソースコードを表示させるのに使うべきHTMLタグは？
<｜＆lt；
>｜＆gt；
&｜＆ａｍｐ；
"｜＆ｑｕｏｔ；
｜＆ｎｂｓｐ；
¥｜＆ｙｅｎ；
£｜＆ｐｏｕｎｄ；
©｜＆ｃｏｐｙ；
®｜＆ｒｅｇ；
†｜＆ｄａｇｇｅｒ；
§｜＆ｓｅｃｔ；
²｜＆ｓｕｐ２；
³｜＆ｓｕｐ３；
‘’｜＆ｌｓｑｕｏ；＆rｓｑｕｏ；
“”｜＆ｌdｑｕｏ；＆rdｑｕｏ；
♨｜＆＃９８３２；
✓｜＆＃１０００３；
⌘｜＆＃８９８４；
✿｜＆＃１００４７；
▶｜＆＃９６５４；
◀｜＆＃９６６４；
▷｜＆＃９６５５；
◁｜＆＃９６６５；
<%preventry_title>[next] ＆＃９５６４；
』とか、『現代中国の産業―勃興する中国企業の強さと脆さ
』とか、バラツキのある関心に一発で答えてくれるのは、やっぱ行きつけの本屋だよなぁ。オヤジ長生きしてくれ。当ブログのコピーライトは「かみちゅドメイン」に帰属します。と言っても勝手に作ったモノなので法的にはむちゃくちゃなハズであります。
え～とつまり、そのへんの神社にいくと名札みたいのが掛かってる事がありますな。
改築とかそういうときに寄付した人の名前が書いてあるような。盆踊りなどでもあるかもしれません。
著作権の一切合切をそんなカンジでどっかに『奉納』してしまえ！という事です。
奉納しちゃったからにはカミサマのもんなので、コピペも改変も私がどうこう言う筋合いはありません。ただし "All Rights Reserved" とか表記したら、ちょ～っとバチがあたるかもよ～ん？というもんです。『おそなえ』ですから。
課題は以下：
基本的な紹介：Lc-Factory＠FC2ブログ プラグイン「Lc.ツリーカテゴリー」
FC2のカテゴリリストをツリー化するプラグイン。同種のものに、シンプルカテゴリツリー(YahooUI版)や、FcafeさんのTree シリーズがあるが、前者の簡便さと後者のカスタマイズ幅の広さを兼ね備える。
、、、ように思うます。
 ・デフォ「開」 ・区切り記号「/」 ・先頭記号「・」 |
■グループの初期状態 デフォ開、他に閉。
手許では開を選択。 後から任意項目を「閉」にできる。 ■グループとカテゴリーを区切る文字 デフォ全角スペース、任意に変更可。
手許では"/" ■リンクの先頭に付ける記号 デフォ★、任意に変更可。
手許では中黒（・） |
 ・「MPlayer」は開いているが、「Man」は閉じている。 |
■基本的なグルーピング カテゴリ名に区切り文字を入れる。
例：x264cli/ --longhelp ■多段ツリー カテゴリ名の例：MPlayer/Man/もくじ
区切り文字を複数使うと多段化する。 段数は8段程度まで行けるようだが、カテゴリ名に字数制限がある。 ■一部のカテゴリーだけ開く カテゴリ名の例：MPlayer/.Man/ もくじ（図参照）
グループ名の先頭に半角ピリオドを打つと、そのカテゴリの初期状態が閉になる。 ※さらに上位のカテゴリを追加したり、右図のようにグループ先頭の記号を変更するには、プラグインのHTML(Javascript)内部に設定箇所が ある。 |
 |
■「追加グループ設定」を以下の手順で変更
|
 |
■「表示設定」を以下の通り変更
※Lc-Factory/雑記 Lc.ツリーカテゴリーの、CSS設定について（その１） ■「その他」設定を以下の通り変更 // ■その他
※参考：使えそうな実体参照 |
ブラウザのタイトルバー表示、および、ブックマークされる時の名前を、FC2変数と組 み合わせて、記事単位、抽出条件単位で変えたい場合の例。<head>～</head>内で使う。
| HTML（タグや画面にそのまま出る文字列）/CSS | FC2変数 |
| テンプ レ | メモ |
|---|---|
| <!--▼title--> | （コメント） |
| <title
xml:lang="ja" lang="ja"> |
タイトルタグ開始（xmlとHTMLの両方式で日本語を指定） |
| <!--index_area--> <%blog_name> - <%introduction> <!--/index_area--> |
表紙の場合、 ブログ名 - ブログの説明 表紙の場合・了 |
| <!--permanent_area--> <%sub_title> - <!--topentry--> <%topentry_year>/<%topentry_month>/<%topentry_day> <!--/topentry--> <%blog_name> <!--/permanent_area--> |
記事個別の場合、 汎用サブタイトル（permanent_areaでは記事タイトル） - 記事内容を繰り返し表示 （記事の）年/月/日 記事内容を繰り返し表示・了 半角スペース-ブログ名 記事個別の場合・了 |
| <!--date_area--> 日付：<%sub_title> - <%blog_name> <!--/date_area--> |
日付抽出の場合、 日付：汎用サブタイトル（date_areaでは20080215など）- ブログ名 日付抽出の場合・了 |
| <!--category_area--> カテゴリ： <%sub_title> - <%blog_name> <!--/category_area--> |
カテゴリ抽出の場合、 カテゴリ： 汎用サブタイトル（category_areaではカテゴリ名）- ブログ名 カテゴリ抽出の場合・了 |
| <!--tag_area--> タグ： <%sub_title> - <%blog_name> <!--/tag_area--> |
タグ抽出の場合、 タグ： 汎用サブタイトル（tag_areaではタグ名）- ブログ名 タグ抽出の場合・了 |
| <!--search_area--> "<%sub_title>" の検索結果 - <%blog_name> <!--/search_area--> |
単語検索の場合、 "汎用サブタイトル（search_areaでは検索語）" の検索結果 - ブログ名 単語検索の場合・了 |
| <!--not_search_area--> <!--not_tag_area--> <!--not_category_area--> <!--not_date_area--> <!--not_permanent_area--> <!--not_index_area--> <%blog_name> <!--/not_index_area--> <!--/not_permanent_area--> <!--/not_date_area--> <!--/not_category_area--> <!--/not_tag_area--> <!--/not_search_area--> |
単語検索ではなく、 タグ抽出でもなく、 カテゴリ抽出でもなく、 日付抽出でもなく、 記事個別でもなく、 表紙でもない場合*、 ブログ名 表紙以外・了 記事個別以外・了 日付抽出以外・了 カテゴリ抽出以外・了 タグ抽出以外・了 単語検索以外・了 *（つまり通常の時系列表示。URL末尾にpage=0などがつく） |
| </title> | タイトルタグ・了 |
<!--▼title-->
<title xml:lang="ja" lang="ja">
<!--index_area--><%blog_name> - <%introduction>
<!--/index_area-->
<!--permanent_area--><%sub_title> - <!--topentry--><%topentry_year>/<%topentry_month>/<%topentry_day><!--/topentry--> <%blog_name>
<!--/permanent_area-->
<!--date_area-->日付：<%sub_title> - <%blog_name>
<!--/date_area-->
<!--category_area-->カテゴリ：<%sub_title> - <%blog_name>
<!--/category_area-->
<!--tag_area-->タグ：<%sub_title> - <%blog_name>
<!--/tag_area-->
<!--search_area-->"<%sub_title>" の検索結果 - <%blog_name>
<!--/search_area-->
<!--not_search_area-->
<!--not_tag_area-->
<!--not_category_area-->
<!--not_date_area-->
<!--not_permanent_area-->
<!--not_index_area-->
<%blog_name>
<!--/not_index_area-->
<!--/not_permanent_area-->
<!--/not_date_area-->
<!--/not_category_area-->
<!--/not_tag_area-->
<!--/not_search_area-->
</title>※コピペは実体参照に注意。
| HTML（タグや画面にそのまま出る文字列）/CSS | FC2変数 |
| テ ンプレ | メモ |
|---|---|
| <!--plugin--> | プラグインを繰り返し表示 |
| <!--plugin_first--> |
プラグイン1を繰り返し表示 |
| <h2 style="text-align:<%plugin_first_talign>;"> | h2開 始。文字揃えは、プラグイン1で指定したもの。 |
| <a
id="<%plugin_first_title>"
name="<%plugin_first_title>"></a> |
アンカー指定。各プラグイン名をア ンカー名に（XMLとHTML4の両方式で記載）。 |
| <%plugin_first_title> |
プラグイン1のタイトル |
| </h2> | h2・ 了 |
| <div
class="PlgCont"> |
div開 始。クラス名PlgCont。 |
| <p
class="PlgDescript"> <%plugin_first_description> </p> |
p開
始、クラス名PlgDescript。 プラグイン1の説明1 p・ 了 |
| <%plugin_first_content> |
プラグイン1のなかみ |
| <p
class="PlgDescript"> <%plugin_first_description2> </p> |
p開
始、クラス名PlgDescript。 プラグイン1の説明2 p・ 了 |
| </div><!--cls
PlgCont--> |
div・ 了。クラス名PlgCont・了をコメントで附記。 |
| <!--/plugin_first--> |
プラグイン1を繰り返し表示・了 |
| <!--/plugin--> | プラグインを繰り返し表示・了 |
<!--plugin-->
<!--plugin_first-->
<h2 style="text-align:<%plugin_first_talign>;"><a id="<%plugin_first_title>" name="<%plugin_first_title>"></a>
<%plugin_first_title>
</h2>
<div class="PlgCont">
<p class="PlgDescript"><%plugin_first_description></p>
<%plugin_first_content>
<p class="PlgDescript"><%plugin_first_description2></p>
</div><!--cls PlgCont-->
<!--/plugin_first-->
<!--/plugin-->※コピペは実体参照に注意。
| HTML（タグや画面にそのまま出る文字列）/CSS | FC2変数 |
| テ ンプレ | メモ |
|---|---|
| <!--パンクズリスト --> | （コメント） |
| <!--index_area--> <%introduction> <!--/index_area--> |
表紙の場合、 ブログの説明 表紙の場合・了 |
| <!--category_area--> <a href="<%url>">表紙</a> > カテゴリ： <%sub_title> （↑古・新↓） <!--/category_area--> |
カテゴリ抽出の場合、 a（リン ク）「表紙」 「半角スペース>半角スペース」 「カテゴリ：」 汎用サブタイトル（category_areaではカテゴリ名） 「（↑古・新↓）」 カテゴリ抽出の場合・了 |
| <!--tag_area--> <a href="<%url>">表紙</a> > タグ： <%sub_title> （↑古・新↓） <!--/tag_area--> |
タグ抽出の場合、 a（リン ク）「表紙」 「半角スペース>半角スペース」 「タグ：」 汎用サブタイトル（tag_areaではタグ名） 「（↑古・新↓）」 タグ抽出の場合・了 |
| <!--date_area--> <a href="<%url>">表紙</a> > 日付： <%sub_title> （↑古・新↓） <!--/date_area--> |
日付抽出の場合、 a（リン ク）「表紙」 「半角スペース>半角スペース」 「日付：」 汎用サブタイトル（tag_areaでは20080215など） 「（↑古・新↓）」 日付抽出の場合・了 |
| <!--search_area--> <a href="<%url>">表紙</a> > 検索： <%sub_title> （↑古・新↓） <!--/search_area--> |
単語検索の場合、 a（リン ク）「表紙」 「半角スペース>半角スペース」 「検索：」 汎用サブタイトル（search_areaでは検索語） 「（↑古・新↓）」 単語検索の場合・了 |
| <!--titlelist_area--> titlelist_area <!--/titlelist_area--> |
タイトルリスト表示モードの場合、 「titlelist_area」 タイトルリスト表示モードの場合・了 |
| <!--permanent_area--> <a href="<%url>">表紙</a> > <!--topentry--> Category : <a href="<%topentry_category_link>"> <%topentry_category> </a> > e<%topentry_no> <!--/topentry--> <%sub_title> <!--/permanent_area--> |
記事個別の場合、 a（リン ク）「表紙」 「半角スペース>半角スペース」 記事内容を繰り返し表示 「Category：」 a（リン ク）開始、その記事のカテゴリへ 「カテゴリ名」 a（リン ク）終了 「半角スペース>半角スペース」 e「記事番号」 記事内容を繰り返し表示・了 「半角スペース」 汎用サブタイトル（permanent_areaでは記事タイトル） 記事個別の場合・了 |
| <!--not_search_area-->
<!--not_tag_area--> <!--not_category_area--> <!--not_date_area--> <!--not_permanent_area--> <!--not_index_area--> <a href="<%url>">表紙</a> > 時系列（↑新・古↓） <!--/not_index_area--> <!--/not_permanent_area--> <!--/not_date_area--> <!--/not_category_area--> <!--/not_tag_area--> <!--/not_search_area--> |
単語検索ではなく、 タグ抽出でもなく、 カテゴリ抽出でもなく、 日付抽出でもなく、 記事個別でもなく、 表紙でもない場合*、 a（リン ク）「表紙」 「半角スペース>半角スペース」 「時系列（↑新・古↓）」 表紙以外・了 記事個別以外・了 日付抽出以外・了 カテゴリ抽出以外・了 タグ抽出以外・了 単語検索以外・了 *（つまり通常の時系列表示。URL末尾にpage=0などがつく） |
<!--パンクズリスト-->
<!--index_area--><%introduction>
<!--/index_area-->
<!--category_area--><a href="<%url>">表紙</a> > カテゴリ：<%sub_title>（↑古・新↓）
<!--/category_area-->
<!--tag_area--><a href="<%url>">表紙</a> > タグ：<%sub_title>（↑古・新↓）
<!--/tag_area-->
<!--date_area--><a href="<%url>">表紙</a> > 日付：<%sub_title>（↑古・新↓）
<!--/date_area-->
<!--search_area--><a href="<%url>">表紙</a> > 検索：<%sub_title>（↑古・新↓）
<!--/search_area-->
<!--titlelist_area-->titlelist_area
<!--/titlelist_area-->
<!--permanent_area--><a href="<%url>">表紙</a> >
<!--topentry-->Category : <a href="<%topentry_category_link>"><%topentry_category></a>
> e<%topentry_no><!--/topentry--> <%sub_title>
<!--/permanent_area-->
<!--not_search_area-->
<!--not_tag_area-->
<!--not_category_area-->
<!--not_date_area-->
<!--not_permanent_area-->
<!--not_index_area--> <a href="<%url>">表紙</a> > 時系列（↑新・古↓）
<!--/not_index_area-->
<!--/not_permanent_area-->
<!--/not_date_area-->
<!--/not_category_area-->
<!--/not_tag_area-->
<!--/not_search_area-->※コピペは実体参照に注意。
T字配置。トップ水平と左サイドバー固定。サイドバーは別スクロール。
よーするにGoogle Readerやld Readerなのだが、難しいったらありゃしない。
＊↑正常動作はしません。特にIEではブラクラまがいになる筈です。
手許のブラウザでの表示
 |
 |
 |
| Firefox 3.0b5 | Safari 3.1 | Opera 9.50b |
borderなどの四辺をまるくする。これはp。
背景だけでもなぜか行ける。これもp。
| 書式 | 手許表示 | |
|---|---|---|
| CSS3 | border-radius | |
| Fx3 | -moz-border-radius | ○ |
| Sf3 | -webkit-border-radius | ○ |
| Op9.5b | ？？？ | × |
※FC2の試作テンプレートにHTMLを直書きし、プレビューで確認。
※MSもなんらかのプレフィックスを付けて先行実装してるのではないかと思うが、未確認。
<p style=" -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; border: solid 5px blue; width: 100px; ">
Safari, Fx, 未来のCSS3ブラウザ用。後ろに書いたものほど優先。
資料1によると、CSS3はまだ全体像すら固まっていない。従って、ブラウザによる実装の違いは、H.264やMP4なみかそれ以上の可能性がある。バグが有ろうがショボかろうが、先駆けてデファクトを取ってしまえば左団扇なのは、IEもiPodも一緒だ一緒だ。
でも使う。面白いから^^;。
Kompozerで html を書くと、設定が「ページの保存・公開時に、」/「元のソースの書式のままにする」でも補正がかかる。上記を記事にするためにKompozerに挿入したらこうなった。
-moz-border-radius-topleft: 20px;
-moz-border-radius-topright: 20px;
-moz-border-radius-bottomright: 20px;
-moz-border-radius-bottomleft: 20px;
資料3.によると、現段階のCSS 3では border-top-left-radius なのでちょっと書式が違う。Sf3の -webkit-border-top-left-radius の方が近い。
しかし、書き換えるという事は、少なくとも -moz-border-radius は理解しているという事で、、、CSS辞書とか内蔵してないのかこれは。GUIの枠線指定からは入力できないようだが。思うに、-moz-xxx系はCSS3 の先行実装だと思っていたが、先行してるだけに、規格が固まってくると書式が変わったりもするのだろう。そーなるとFx系しか面倒見てくれないCSSになるわけで、、、そうか。そりゃGUIに入れちゃまずいよな。
Kompozerは、Fx3系からコピペすると素のテキストになるようになってしまい、スクラップには向かなくなった。また、開発はいろいろあって不活発で、新しいGecko版が出るかどうかはちと微妙。Safariや未来のCSS3ブラウザを考えると不安。しかし WYSIWYG の HTMLエディタとしてはお手軽千万であり、ブログの下書きには重宝千万なのであった、、、できれば勝手に改行挟むの止めてほしいけど。和文だと変なスペースが入る。
＊＊＊
なお、-moz-xxx系の一覧は、資料4のMの項、Netscape CSS Extensions - Cascading Style Sheets Syntax にある。これによると、特に解説ドキュメントの類いは用意されておらず、直にMozillaのコード読むしかない、、、と書いてある印象を受けた。うーん。規格はあるけど実装は様々てのは、H.264やMP4以下略。MSも腰を上げた事だし、HTML5 / CSS3戦争の明日はどっちだ。
「サイドバースクロール」という検索語があったのですが、そゆ人はここへゆくとしあわせになれるかもしれません。
ただし、水平固定は、全て画面をタテカラムに区切ってから指定しているので、上部を横一線で固定、その下を2分割という、、、ファインダーやノーチラスやエクスプローラやgoogle readerっぽい事はできません。そういうサイトはjavascript使ってるようです。
また、最終更新が06年12月と古いので、リンク先の対応確認はIE5+, Opera7+, and Firefox（たぶん1.5）というカンジです。
3カラムそれぞれを別スクロールさせると、以下のサンプルみたような事になりました。
やっぱサイドバーやメニューが本文と一緒に流れてくのって、おかしいよねぇ？