ホームページ作成その6 ボタンの作成2

前回の日記の最後に「ちょっと?になったこともあった」と書いたのですが、いろいろ分かったので書いておきます。


前回の?な事というのは、リンクの設定を文字に付けようとしたのに、他のページと同じ設定にどうしてもならなくて…という事でした。

リンクの設定を付けた文字の上にカーソルを乗せると文字の色が変わる、という風にしたかったのですが、他のページは出来ているのに、iINDEXページだけはうまく作れませんでした。

まあ、原因は簡単だったのですが。
他のページはスタイルシート(css)を反映させていて、INDEXページのみは、スタイルシート(css)は反映させていない、というのが原因でした。
「カーソルを乗せると文字色が変わる」という設定は、スタイルシートを使うと設定できるもので、CSSファイルを使うか、各ページごとに設定する時はスタイルシートをhead内に書き込まないと出来ないものだったんですね〜
またお勉強になりました。

さて、ということで、INDEXページにはスタイルシートは使わないと決めているので、他のページと同じリンクの設定に出来ないことは決定。
その為、INDEXから各ページに飛ぶリンクも、他のページと違ってしまうんなら、と文字につけるのはやめて、ボタンをくっつけてそれにリンクを付ける事にしました。

そのボタンですが、どこかのサイト様からもらって…と考えましたが、前回も自分で作ったし…こうなったら出来るだけ自作で済ましてしまおう!と考え作りました。

う〜んと考えながらいろいろやってみて、結局一番簡単に、色は1色しか使わず、その色も凝ったものにせずもともとパレット上にあるもの、形も四角、というボタンを作りました。
ゆがみや、バランスくずれ、途中でなげただろ!という部分は小さくて見えないっことにしておいてください〜と見る人の良心にたのんでおきます。

↑こんな感じ
作り方はいつもどおり、もともとパソコン内に入っているものだけを使っています。
エクセルを開いて図形描画で絵を描いて、ペイントへコピーして、「ファイルの種類」をGIFに変えて保存。
で、前回も縮小する時にやった方法です、一度保存した画像をクリックして、「画像の編集」を使い、サイズ変更で全部同じ大きさにそろえました。うまくいかない時はトリミングも駆使できますし。この画面便利ですね。

調べついでにリンクについても今度まとめてみますか…