 |
|
| |
この文章は文字詰めを調整できる letter-spacing タグを挿入しています
このページはCSSをソースヘッドに記述したテンプレート
おまけ ... 動的リンクボタンをあれこれ考察したサンプル付き
画像を二つ準備するのが面倒くさいけど、マウスの位置によって画像が変わる仕掛けはダイナミックぽい。左側は this.src を使った簡易型。右側は name で仕分けしているので複数になっても同時に使える、ハズ。
CSSを外部シートに記述したテンプレートも。結構 cool!
最初に作った外部スタイルサンプルはとっても面白いんだけどmusicファイルを使ったので著作権がらみが心配? という訳で頑張って新しいのを作りました。リンクアンカーはボタン画像風に見えるけど、実は背景画像をリピート貼りしています。。。比較用ダミーの方はふつうのボタン画像がマウスのオンオフで切り替わるダミーアンカーです。
透過させることで見え方が変わる背景用 gif 画像サンプル
透明下地に white で描いた画像のボリュームを増減させることで screen 上で見える色調を変えてみたサンプルです。どんな背景画像や背景色でもそれなりに見え方が変わるメリットがあります。
どんなシチュエーションでも使える「ポップアップ/自動閉」のサンプル
アンカー画像はマウスオーバーすると陥没して見えるようあらかじめCSS内でデザイン指定しているのでちょっとおしゃれ。ポップアップウィンドゥにはちょっと大き目に手作りした「閉じる」画像も載せました。
もいっちょおまけ! 使える HGep フォントナンバー!
タイトルロゴを描き起こすときにはデザインフォントが欲しくなりますよね。Windows OS にオプションインストールで付いて来る HGepフォントのうちNo.7,13,14,29,30,43,52,58は使えますです。このページのタイトルではNo.058を加工して使いました。
