記述ソースのまとめ
サンプルHTMLページを用意しました。
先にHTMLソースをご紹介して、その下に実際の表示のされ方を掲載しています。
<html>
<head>
<title>ボタンのサンプルページ</title>
<STYLE TYPE="text/css"><!--
A.btn { text-decoration: none; color: #550000;
font-weight: bold; font-size: 11pt; }
A.btn:hover { color: #ffff55; font-size: 12pt; }
--></STYLE>
</head>
<body>
<h1>ボタンのサンプル</h1>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td background="ButtonBase.gif" width="100"
height="31" align="center">
<a href="(URL)" class="btn">自己紹介</a>
</td>
</tr>
<tr><td><br></td></tr>
<tr>
<td background="ButtonBase.gif" width="100"
height="31" align="center">
<a href="(URL)" class="btn">日 記</a>
</td>
</tr>
<tr><td><br></td></tr>
<tr>
<td background="ButtonBase.gif" width="100"
height="31" align="center">
<a href="(URL)" class="btn">イラスト</a>
</td>
</tr>
</table>
</body>
</html>
見え方：
ボタンのサンプル
|
ぜひ、試してみて下さい！
というわけで今回は、無地のボタン画像を1つ用意するだけで、いくらでもボタンが作れる方法をご紹介致しました。ぜひ、活用してみて下さい。
なお、無地のボタン画像は、フリー素材サイトなどで多く公開されていますので、気に入った画像を探して利用されると良いでしょう。
【関連記事】
