表示に関するHow-to
配信されるHTMLのソースはこのような構造になっています。
<div class="kdQuote">(格言)
(空行)
(引用元)
<div class="kdQuoteBy" style="text-align:right;font-size:smaller;">
by
<a href="http://www.ki-dousen.net" target="_blank">
起-動線
</a>
</div>
</div>
スタイルシートによって見栄えを調整する最も簡単な方法は、下記のようなブロックをホームページの<head>タグと</head>タグとの間に記述することです。
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
<!--
/* 「本日の格言」ブロック */
.kdQuote{
width : 190px; /* ブロックの幅(100%のようにパーセント表示も可能) */
border : 1px solid #0000ff; /* 枠線の幅、種類、色 */
padding : 4px; /* 枠と文字とのスキマ */
margin : 0px; /* 枠と枠の外の要素とのスキマ */
/* font-size : medium; /* 文字の大きさ */
/* color : #00000f; /* 文字の色 */
/* background-color : #fffff0; /* 背景の色 */
}
/* 「本日の格言」ブロック中の作者ブロック */
.kdQuoteBy{
}
-->
</style>
スタイルシートで設定できる情報や、スタイルシートを別ファイルに保存する方法については、例えば下記のサイトが参考になります。> とほほのスタイルシート入門
> スタイルシートの基本 -- ごく簡単なHTMLの説明
文字化けするとき
まれに文字化けのご連絡をいただきます。一部のブラウザでは文字コードの混在ができないことが原因のようで、EUC-JP以外の文字コードのページに「本日の格言」を埋め込み、かつOperaブラウザでサイトを閲覧した際に起こるようです(ただ、当方では再現できていません)。
文字化けを防ぐには、インラインフレームを使った方法をお試しください。まず、下記のように「本日の格言」だけを表示するファイルを作成し、Webサーバに保存します。
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=EUC-JP"> </head> <body> <script type="text/javascript" src="http://www.ki-dousen.net/archit/quotes/xxxx.js" charset="euc-jp"> </script> </body> </html> (xxxxは起-動線のユーザ名に置き換えます)
上記のファイル自体も、(やり方をご存じであれば)文字コードをEUCとして保存してください。そしてこのファイルを、インラインフレーム(iframeタグ)を使って格言を表示するWebページに埋め込みます。上記のファイルをkdquotes.htmlという名前で保存した場合のサンプルは下記のようになります。
<iframe class="kdQuoteF" src="kdquotes.html"scrolling="NO" frameborder="0"></iframe> (ファイルの保存場所によってはパス指定が必要です)
見栄えを調整するには、このページの上にあるやり方を参考にして"kdQuoteF"クラスに必要な指定をします。上記サンプルの、"kdQuote"を"kdQuoteF"に書き換えて編集を開始するのが簡単です。

