シンプルテーブルボタン/HTMLタグ素材集

かわいいＢ	和風Ｂ	シンプルＢ	絵文字Ｂ	マジックＢ
装飾文字Ｂ	テーブルＢ	立体テーブルＢ	シンプルテーブルＢ	透過Ｂ

※フレームリンクの場合は<a href="URL" target="フレーム名" style=～の
ように太字部分target="フレーム名"を追加して下さい

↓ページ最下部にテーブルボタン用の簡易メニューレイアウトがあります。↓

マウスをのせると色が変わるシンプルテーブルボタン１

テーブルボタン１

<table border="1" cellspacing="0" cellpadding="2" width="140" height="20">
<tr><td bordercolor="#45607a" bgcolor="#ccccff" align=center onmouseover="this.style.background='#ffffff'" onmouseout="this.style.background='#ccccff'">
<a href="ページURL" style="color:#004a95;text-decoration:none;font-size:15px;width:100%;">
ボタンの文字</a>
</td></tr></table>

マウスをのせると色が変わるシンプルテーブルボタン２

テーブルボタン２

<table border="1" cellspacing="0" cellpadding="2" width="140" height="20">
<tr><td bordercolor="#45607a" bgcolor="#ffbfff" align=center onmouseover="this.style.background='#ffffff'" onmouseout="this.style.background='#ffbfff'">
<a href="ページURL" style="color:#ff00ff;text-decoration:none;font-size:15px;width:100%;">
ボタンの文字</a>
</td></tr></table>

マウスをのせると色が変わるシンプルテーブルボタン３

テーブルボタン３

<table border="1" cellspacing="0" cellpadding="2" width="140" height="20">
<tr><td bordercolor="#45607a" bgcolor="#bfffbf" align=center onmouseover="this.style.background='#ffffff'" onmouseout="this.style.background='#bfffbf'">
<a href="ページURL" style="color:#009500;text-decoration:none;font-size:15px;width:100%;">
ボタンの文字</a>
</td></tr></table>

マウスをのせると色が変わるシンプルテーブルボタン４

テーブルボタン４

<table border="1" cellspacing="0" cellpadding="2" width="140" height="20">
<tr><td bordercolor="#45607a" bgcolor="#ffff80" align=center onmouseover="this.style.background='#ffffff'" onmouseout="this.style.background='#ffff80'">
<a href="ページURL" style="color:#959500;text-decoration:none;font-size:15px;width:100%;">
ボタンの文字</a>
</td></tr></table>

マウスをのせると色が変わるシンプルテーブルボタン５

テーブルボタン５

<table border="1" cellspacing="0" cellpadding="2" width="140" height="20">
<tr><td bordercolor="#45607a" bgcolor="#c9c9c9" align=center onmouseover="this.style.background='#ffffff'" onmouseout="this.style.background='#c9c9c9'">
<a href="ページURL" style="color:#4a4a4a;text-decoration:none;font-size:15px;width:100%;">
ボタンの文字</a>
</td></tr></table>

マウスをのせると色が変わるシンプルテーブルボタン６

テーブルボタン６

<table border="0" cellspacing="0" cellpadding="2" width="140" height="20" style="border:thin dotted #0080ff;">
<tr><td bordercolor="#45607a" bgcolor="#ffffff" align=center onmouseover="this.style.background='#ccccff'" onmouseout="this.style.background='#ffffff'">
<a href="ページURL" style="color:#0080ff;text-decoration:none;font-size:15px;width:100%;">
ボタンの文字</a>
</td></tr></table>

マウスをのせると色が変わるシンプルテーブルボタン７

テーブルボタン７

<table border="0" cellspacing="0" cellpadding="2" width="140" height="20" style="border:thin dotted #ff00ff;">
<tr><td bordercolor="#45607a" bgcolor="#ffffff" align=center onmouseover="this.style.background='#ffbfff'" onmouseout="this.style.background='#ffffff'">
<a href="ページURL" style="color:#ff00ff;text-decoration:none;font-size:15px;width:100%;">
ボタンの文字</a>
</td></tr></table>

マウスをのせると色が変わるシンプルテーブルボタン８

テーブルボタン８

<table border="0" cellspacing="0" cellpadding="2" width="140" height="20" style="border:thin dotted #009500;">
<tr><td bordercolor="#45607a" bgcolor="#ffffff" align=center onmouseover="this.style.background='#bfffbf'" onmouseout="this.style.background='#ffffff'">
<a href="ページURL" style="color:#009500;text-decoration:none;font-size:15px;width:100%;">
ボタンの文字</a>
</td></tr></table>

マウスをのせると色が変わるシンプルテーブルボタン９

テーブルボタン９

<table border="0" cellspacing="0" cellpadding="2" width="140" height="20" style="border:thin dotted #959500;">
<tr><td bordercolor="#45607a" bgcolor="#ffffff" align=center onmouseover="this.style.background='#ffff80'" onmouseout="this.style.background='#ffffff'">
<a href="ページURL" style="color:#959500;text-decoration:none;font-size:15px;width:100%;">
ボタンの文字</a>
</td></tr></table>

マウスをのせると色が変わるシンプルテーブルボタン10

テーブルボタン10

<table border="0" cellspacing="0" cellpadding="2" width="140" height="20" style="border:thin dotted #4a4a4a;">
<tr><td bordercolor="#45607a" bgcolor="#ffffff" align=center onmouseover="this.style.background='#c9c9c9'" onmouseout="this.style.background='#ffffff'">
<a href="ページURL" style="color:#4a4a4a;text-decoration:none;font-size:15px;width:100%;">
ボタンの文字</a>
</td></tr></table>

マウスをのせると色が変わるシンプルテーブルボタン11

テーブルボタン11

<table border="0" cellspacing="0" cellpadding="2" width="140" height="20" style="border:thin dashed #0080ff;">
<tr><td bordercolor="#45607a" bgcolor="#ffffff" align=center onmouseover="this.style.background='#ccccff'" onmouseout="this.style.background='#ffffff'">
<a href="ページURL" style="color:#0080ff;text-decoration:none;font-size:15px;width:100%;">
ボタンの文字</a>
</td></tr></table>

マウスをのせると色が変わるシンプルテーブルボタン12

テーブルボタン12

<table border="0" cellspacing="0" cellpadding="2" width="140" height="20" style="border:thin dashed #ff00ff;">
<tr><td bordercolor="#45607a" bgcolor="#ffffff" align=center onmouseover="this.style.background='#ffbfff'" onmouseout="this.style.background='#ffffff'">
<a href="ページURL" style="color:#ff00ff;text-decoration:none;font-size:15px;width:100%;">
ボタンの文字</a>
</td></tr></table>

マウスをのせると色が変わるシンプルテーブルボタン13

テーブルボタン13

<table border="0" cellspacing="0" cellpadding="2" width="140" height="20" style="border:thin dashed #009500;">
<tr><td bordercolor="#45607a" bgcolor="#ffffff" align=center onmouseover="this.style.background='#bfffbf'" onmouseout="this.style.background='#ffffff'">
<a href="ページURL" style="color:#009500;text-decoration:none;font-size:15px;width:100%;">
ボタンの文字</a>
</td></tr></table>

マウスをのせると色が変わるシンプルテーブルボタン14

テーブルボタン14

<table border="0" cellspacing="0" cellpadding="2" width="140" height="20" style="border:thin dashed #959500;">
<tr><td bordercolor="#45607a" bgcolor="#ffffff" align=center onmouseover="this.style.background='#ffff80'" onmouseout="this.style.background='#ffffff'">
<a href="ページURL" style="color:#959500;text-decoration:none;font-size:15px;width:100%;">
ボタンの文字</a>
</td></tr></table>

マウスをのせると色が変わるシンプルテーブルボタン15

テーブルボタン15

<table border="0" cellspacing="0" cellpadding="2" width="140" height="20" style="border:thin dashed #4a4a4a;">
<tr><td bordercolor="#45607a" bgcolor="#ffffff" align=center onmouseover="this.style.background='#c9c9c9'" onmouseout="this.style.background='#ffffff'">
<a href="ページURL" style="color:#4a4a4a;text-decoration:none;font-size:15px;width:100%;">
ボタンの文字</a>
</td></tr></table>

マウスをのせると色が変わるシンプルテーブルボタン16

テーブルボタン16

<table border="0" cellspacing="0" cellpadding="2" width="140" height="20" style="border:thin ridge #0080ff;">
<tr><td bordercolor="#45607a" bgcolor="#ffffff" align=center onmouseover="this.style.background='#ccccff'" onmouseout="this.style.background='#ffffff'">
<a href="ページURL" style="color:#0080ff;text-decoration:none;font-size:15px;width:100%;">
ボタンの文字</a>
</td></tr></table>

マウスをのせると色が変わるシンプルテーブルボタン17

テーブルボタン17

<table border="0" cellspacing="0" cellpadding="2" width="140" height="20" style="border:thin ridge #ff00ff;">
<tr><td bordercolor="#45607a" bgcolor="#ffffff" align=center onmouseover="this.style.background='#ffbfff'" onmouseout="this.style.background='#ffffff'">
<a href="ページURL" style="color:#ff00ff;text-decoration:none;font-size:15px;width:100%;">
ボタンの文字</a>
</td></tr></table>

マウスをのせると色が変わるシンプルテーブルボタン18

テーブルボタン18

<table border="0" cellspacing="0" cellpadding="2" width="140" height="20" style="border:thin ridge #009500;">
<tr><td bordercolor="#45607a" bgcolor="#ffffff" align=center onmouseover="this.style.background='#bfffbf'" onmouseout="this.style.background='#ffffff'">
<a href="ページURL" style="color:#009500;text-decoration:none;font-size:15px;width:100%;">
ボタンの文字</a>
</td></tr></table>

マウスをのせると色が変わるシンプルテーブルボタン19

テーブルボタン19

<table border="0" cellspacing="0" cellpadding="2" width="140" height="20" style="border:thin ridge #959500;">
<tr><td bordercolor="#45607a" bgcolor="#ffffff" align=center onmouseover="this.style.background='#ffff80'" onmouseout="this.style.background='#ffffff'">
<a href="ページURL" style="color:#959500;text-decoration:none;font-size:15px;width:100%;">
ボタンの文字</a>
</td></tr></table>

マウスをのせると色が変わるシンプルテーブルボタン20

テーブルボタン20

<table border="0" cellspacing="0" cellpadding="2" width="140" height="20" style="border:thin ridge #4a4a4a;">
<tr><td bordercolor="#45607a" bgcolor="#ffffff" align=center onmouseover="this.style.background='#c9c9c9'" onmouseout="this.style.background='#ffffff'">
<a href="ページURL" style="color:#4a4a4a;text-decoration:none;font-size:15px;width:100%;">
ボタンの文字</a>
</td></tr></table>

テーブルボタン用簡易メニューレイアウト
コピペしたタグの[テーブルボタン1～5]の文字を消してお好きな
テーブルボタンタグと入れ替えて下さい。

文字と好きなテーブルボタンを入れ替えるとこんな感じになります。
色違いのテーブルボタンを入れるとカラフルなメニューが簡単に出来ますよ♪

<Table border="0" width="145" cellpadding="5" cellspacing="0">
<Tr><Td align="center" valign="middle">

テーブルボタン１

</Td></Tr>
<Tr><Td align="center" valign="middle">

テーブルボタン２

</Td></Tr>
<Tr><Td align="center" valign="middle">

テーブルボタン３

</Td></Tr>
<Tr><Td align="center" valign="middle">

テーブルボタン４

</Td></Tr>
<Tr><Td align="center" valign="middle">

テーブルボタン５

</Td></Tr></Table>

ホームページに広告張るなら	A8.net
有料ホームページ始めるなら	ロリポップ！
無料ＣＧＩ色々	ACR WEB