スタイルシートでロールオーバー画像上にテキスト表示させたいです

質問

スタイルシートで画像のロールオーバーリンクを作成したのですが、
その画像の任意の箇所にテキストを入れたいのですが(マウスon/off時、内容・箇所同じ)記述の仕方がわかりません。
ご教授よろしくお願いいたします。

回答No.1

abril

> スタイルシートで画像のロールオーバーリンクを作成したのですが、
> その画像の任意の箇所にテキストを入れたいのですが(マウスon/off時、内容・箇所同じ)記述の仕方がわかりません。

では、現在は少なくとも前半の部分はできている状態なのでしょうから、その部分のHTMLとCSSを提供して下さい。画像の縦横サイズも明記した上で。
＃それから、これは【質問番号：5127509】の方とは無関係（また別の箇所）の質問ですか？

補足

5127509の質問とは別ものです。
補足ですが、1つのロールオーバー画像に1つのテキスト(テキスト1)を表示することは、調べてできたのですが(下記CSS&HTML)、1つのロールオーバー画像に2つのテキスト(テキスト1とテキスト2)を表示することができません。
↓[画像]
■■■■■■■■■■■■
■■■テキスト1 ■■■■
■■■■■■■■■■■■
■■■■■■■■■■■■
■■■■■■■■■■■■
■■■■■テキスト2 ■■
■■■■■■■■■■■■
↑このようなものにしたいと考えてます。
すみません。よろしくお願いします。
【ＣＳＳ】
#taiken01 {
display:block;
width:200px;
height:135px;
padding:0px 10px 10px 10px;
text-align:left;
}
a.taiken01{
display:block;
background-image:url(img/hogehoge.gif);
background-repeat:no-repeat;
width:164px;
height:124px;
padding:6px 10px 5px 26px;
text-decoration:none;
font-size:12px;
line-height:12px;
}
a.taiken01:hover{
background-image:url(img/hogehoge.gif);
background-repeat:no-repeat;
}

【ＨＴＭＬ】
<div id="taiken01" style="float:left;">
<a href="#" class="taiken01">テキスト1</a>
</div>