シングルクォーテーション

HTMLのテキストエリアのvalueはシングルクォーテーションで囲むようにしている。
そうしないとスペースが入る場合に文字列が落ちてしまうからだが、value内にそのシングルクォーテーションが含まれるとやっぱりうまくいかなくなる。

その時にはシングルクォーテーションを「＆#39;」（実際には＆は半角）に変換するとよい。
同様にダブルクォーテーションは「＆#34;」。

これらを「文字参照」というそうだ。

＃＃＃＃＃
さて４月からの新ドラマだが、昨日の「ゴッドハンド輝」を録画。
近頃松浦亜弥が気になる私は１８日からの「ザ・クイズショウ」も録画予定。
あと「名探偵の掟」も見てみよう。

テーブルの枠を点線にする

テーブルの枠を点線にするには「style='border-style:dotted'」とする

表示テスト

＃久しぶりにロト６を買った。今日が抽選日なのだ。

スタイルの定義

最近、お気に入りのテーブル設定はヘッダに記述するパターンである。

<STYLE TYPE="text/css">
<!--
　　table { font-size:10pt;color:#003300; }
　　span { font-size:8pt ;color:#eeeeee; }
　　body { font-size:9pt ;color:#888888; }
-->
</STYLE>

これだとブラウザの文字サイズを変更しても表示は変わらない。
あちこちに<font color=...>という記述を書かなくて済む。
スタイルシートを勉強するともっと便利なんだろうなあ・・・

＃今日は空がきれいだった

テーブルの文字サイズを部分的に変更

スタイル指定で部分的に文字サイズを変更するために＜ＳＰＡＮ＞を使う

<STYLE TYPE="text/css">
<!--
table { font-size:11px }
span { font-size:9px; }
-->
</STYLE>

<table border=1>
<tr><td>標準のフォント(11px)</td></tr>
<tr><td><span>小さめのフォント(9px)</span></td></tr>
</table>

今日は久々の仕事だな～。
ま、ぼちぼち(笑)

オートリロード

一定時間ごとにリロードさせる場合

<META HTTP-EQUIV=refresh CONTENT=60;URL='自分自身のURL'>

CONTENTに秒数を指定する。
仕事ではあまり使わないけど。。。

全角文字を不可にする

数字を入れて欲しいテキストボックスでは全角にならないようにする方法

<input type=text name=num size=10 style="ime-mode:disabled">

ＩＭＥ以外のＦＥＰでも大丈夫なのだろうか？
このスタイルに「;text-align:right」をつけると右寄せになって、いかにも数字入力って感じがする♪

テーブルのフォントを小さく

ちょっと項目の多いテーブルを作ると表示を小さめにしないといけない。
そんな場合に使おう♪

<table border=1 style='font-size : x-small;'>

x-smallのところを変えると大きくしたり小さくしたりできる。
なんて設定するか忘れた(笑)←ほんとにいい加減な…
だってこればっかりワンパターンで使ってるんだもの(^-^)

リンクの表示をカスタマイズ

リンクしている箇所の表示を好みに合わせて変更させる方法。
たぶんしゃれたサイトの管理人さんはみんな知ってるのだろう。

<STYLE TYPE="text/css">
<!--
a:link { text-decoration:none; color:#000088; }
a:visited { text-decoration:none; color:#660066; }
a:active { text-decoration:none; color:#006666; }
a:hover { text-decoration:underline; color:#ff0000; }
-->
</STYLE>

↑のようにするとリンク先にカーソルが来ると赤い文字になって下線が表示される。

テキストボックスを右寄せする

数字を入力する時に右寄せが必要な場合はこうする

<input type=text STYLE=text-align:right value=100>

スタイルを駆使するとＷｅｂでも見栄え良く作れそうだな…。

色付きのプルダウン

次はＨＴＭＬスタイル技★

プルダウンに色をつけてみる

<select>
<option STYLE=color:#ff0000;background-color:#ffcccc value=red>★★　赤　★★
<option STYLE=color:#00ff00;background-color:#ccffcc value=green>★★　緑　★★
<option STYLE=color:#0000ff;background-color:#ccccff value=blue>★★　青　★★
<option STYLE=color:#444444;background-color:#cccccc value=gray>★★　灰　★★
</select>

なんか華やか～♪＞春よこい！