WDPスキン・SAKURA黒

※HTML化したサンプルなので、リンク先へは飛べません。

使用画像について

• 2006年に、水間公園にて撮った桜の写真を切り抜き加工しました（サンプル画像のアヒルも同日撮影）。桜の花が、枠から少し溢れるようにはみ出すデザインにしたくて試行錯誤。フルCSS＆strict初挑戦。
• 白を前提に作ったので、黒バージョンは色々と妥協。

デザイン関連

• ナビゲージョンは「常に表示する」を前提にデザインしています。個別ページでナビ非表示の時は、記事本文の右側に、ナビ分の余白ができます。
• ページ上部に広告が自動挿入されるサーバーには不向きです。

画像を投稿して、回り込みさせるとこうなります。クリックすると元の大きさの画像が表示されます。画像を投稿して、回り込みさせるとこうなります。クリックすると元の大きさの画像が表示されます。

ついでに、コメントとトラックバックのサンプルも兼ねてみます。ついでに、コメントとトラックバックのサンプルも兼ねてみます。ついでに、コメントとトラックバックのサンプルも兼ねてみます。ついでに、コメントとトラックバックのサンプルも兼ねてみます。

本文内に記述するタグの表示例です。

小見出しの表示例（これはh4）

WebDiaryProの場合、記事内の小見出しはh4から始めます。
h1〜h3は、ブログ自体の見出し等に使われているので、記事部分にはh4以下しか書かない。

小見出しの表示例（これはh5）

h5は↑のような感じで。

小見出しの表示例（これはh6）

h6は↑のような感じで。このへんの見栄えに関しては好みなので、お好きに変更して下さい。

preタグの表示例

preタグと言えばアスキーアート。等幅フォントで表示しないと崩れる・空白等もそのまま表示したい時に使います。はみ出た部分にはスクロールバーが出ます。
大昔のパソコン通信時代、ネットの書き込みがテキストベースで画像を添える事が出来なかったので、普通にテキストでこんな地図書いて、オフの待ち合わせとかしてました。

┃┃　　　　　　　　┃┃↑△△駅へ
┃┃　　　　　花屋■┃┃
┃┗━━━━━━━━┛┗━━━━━━━━━━━━━━━━━━━　
┃┏━━┓┏━━━━━━┓┏━━━━　┏━━━━━┓┏━━━━　
┃┃　■┃┃　　　　　　┃┃※ココ／／　　　　　　┃┃
┃┃　〒┃┃　　　　　　┃┃　　／／　　　　　　　┃┃
┃┃　　┃┃　　　ＧＳ■┃┃　／／　　　　　銀行■┃┃
┃┗━━┛┗━━━━━━┛┗／　┗━━━━━━━━┛┗━━━━　
┃┏━━━━━━━━━━┓┏━━━━━━━━┓┏━━━━━━━　
〜〜　　　　　　　○○橋〜〜　　　　　　　　〜〜　　○○駅へ→　
〜〜　　　　　　　　　　〜〜　　　　　　　　〜〜
┃┃　　　　　　　　　　┃┃■本屋　　　　　┃┃
┃┗━━━━━━━━━━┛┗━━━━━━━━┛┗━━━━━━━　
┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━　

引用（blockquoteタグ）の表示例

これは引用です。これは引用です。これは引用です。これは引用です。これは引用です。これは引用です。これは引用です。これは引用です。これは引用です。これは引用です。これは引用です。これは引用です。これは引用です。これは引用です。これは引用です。これは引用です。これは引用です。これは引用です。これは引用です。これは引用です。これは引用です。これは引用です。これは引用です。