CSSのbackground-imageにリンク

質問

<table width="800" height="100" border="0" cellpadding="0" cellspacing="0" style="background-image:url(images/XXXXXX.jpg);" >

上記のURLにて、テーブルに画像のリンクを張っています。
この画像リンクに、下記のようなリンクタグを使いたいのですが、いろいろと試したのですが、
うまく出来ません。どなたか、ご教授いていただけないでしょうか？

<a href="http://www.XXXX.co.jp/">通常のリンクテキスト </a>

宜しくお願いします。

回答No.2

meah1835

質問文を整理願います。

htmlタグ
「<a href="http://www.XXXX.co.jp/">通常のリンクテキスト </a>」
これでは
「通常のテキストリンク 」にしかなりません

「background-imageにリンク」であれば
<a href="http://www.XXXX.co.jp/"></a>になり

CSSに　display:block;を使うことで可能になります。

回答No.1

ORUKA1951

ひょっとして、tableを使ってデザインしている？
　もしそうなら、早々に変更しましょう。HTML4.01の勧告(1999)以来、強く否定し続けられている手法です。

　ウェブ標準だと
<div class="nav"><!-- HTML5だと<nav> -->
　<h2>サイトマップ</h2>
　<ul>
　　<li><a href=""></a></li>
　　<li><a href=""></a></li>
　　<li><a href=""></a></li>
　</ul>
</div>
　とかになります。
　その上で、
div.nav{width:800px;height:100px;margin:0 auto;position:relative;background-image:url()}
div.nav ul,div.nav ul li{display:block;list-style-type:none;margin:0;padding:0;}
div.nav ul li{width:180px;float:left;line-height:100px;position:relative;text-align:center;}
div.nav ul li a{display:block;width:100%;height:100%;border:1px gray solid;}
とかにデザインします。

★文書構造とデザインと分けること
　それによって、まったく自由自在にデザインできることになります。縦だろうが横だろうが、リンクにポイントすれば浮き上がったり、サブメニューを表示したり・・・、HTML羽手を加えずデザインをまったく異なる--希望のものにデザインできます。
　もちろんHTMLもシンプルでわかりやすいです。

　HTMLの該当部分がどのような文書構造なのかを示してください。(デザインは一切考えない)
　次にどのようにデザインしたいか、簡単なスケッチでも