CSSで文字をリンク付き文字へ変える

質問

CSSを使って、文字を画像へ置き換えることが出来るということを知ったのですが、
ある文字をリンクつきの文字へ置き換えることは可能ですか？

たとえばこんなかんじです。

実際のソース
aaaaa
uaaaaa

CSSの定義で　aaaaa⇒<a href="http://">あいう</a>

表示されるもの
あいう
uあいう

という感じで、あいうはhttp://のリンク入り。

調べてみてもヒットしないので、出来ないのかなという感じがしますが。
CSS以外でも方法があれば教えていただきたいです。
わかる方、回答よろしくお願いします。

回答No.2

leap_day · ベストアンサー

こんにちは

CSSを使用して文字の置き換えという手法は知らないのですが・・・
文字から<img src="">という風に換えられるのであれば同じようにすれば出来るのではないでしょうか？

とりあえずjavascriptを使用して・・・

<script language="javascript"><!--
function ch(n,m) {
n.innerHTML = "あいう";
if(m=="A") n.href="test0.html";
}
//--></script>

<a onMouseover="ch(this,'A')">aaaaaa</a><br>
u<a onMouseover="ch(this,'B')">aaaaaa</a>

もしくは
『aaaaaa』のブロックと『あいう』のブロックを用意して
display:none　←→　display:block　で切り替えるとか？

<script language="javascript"><!--
function bch(m,n) {
m.style.display="none";
document.getElementById(n).style.display = "block";
}
//--></script>

<a onMouseover="bch(this,'B')" id="A">aaaaaa</a>
<a href="" onMOuseout="bch(this,'A')" id="B" style="display:none;">あいう</a>

回答No.3

Dorohedorer

<a></a>の中の文字を<span></span>等で囲んでCSSで見えないように設定し、<a></a>の部分をCSSでブロックと指定し、大きさおよび背景画像を指定する。

以上のような方法で、ソースを見るとテキストだけれども、ブラウザ上では画像で表示されるといった似非置き換えは可能です。この場合ですと、CSSが使えない環境でも文字リンクとして現れるので便利です。

そうでなく、動的に「aaaならば◎◎へのリンク」や「bbbならば××へのリンク」といった風に変えるというのであれば、HTMLではできません。
PHPなりを勉強し使用してください。

回答No.1

ぜ り～（@-Jelly-）

それは不可能ですね。

第一、リンク先は、毎回違うのが普通ですよね？

違うものを、いちいち設定して、
それをわざわざ呼び出してリンクを貼るぐらいなら、

最初っから
<a href="xxxx.html">あいう</a>
と書いていったほうが手間もないし、分かりやすいです。

スタイルシートの役割は、
「文章の見栄えを整えたり、段落を分かりやすくさせる」
というものです。

リンクでCSSを使うなら、
マウスを乗せたときに色を変えるとか、
せいぜいそこまでだと思います