0

HTML の数行をカバーするリンクがあり、ホバーするとすべての色 (またはその他) が変化するはずですが、行ごとにしか反応しません。

JSfiddle を使用してコードを貼り付けると機能しますが、私の wordpress サイトでは機能しなくなりました...

http://jsfiddle.net/6QgAR/

HTML

<div id="homelink"><a href="http://www.google.com"><p style="text-align: center;">    <em>Lorum Ipsum</em><br>
Lorum Ipsum</p>
<p style="text-align: center;">Lorum Ipsum</p>
<p style="text-align: center;">Lorum Ipsum<br>
Lorum Ipsum</p>
</a></div>

CSS

#homelink:hover a{
    color:#ff6600;
    text-decoration:none;
}

ライブ: http://goo.gl/xU0iFz

これがどのように可能か考えていますか?

ありがとう

4

2 に答える 2

0

ライブサイトには、jsfiddle に含めていない他のスタイルシートがあります。p レベルの要素にはいくつかのスタイル設定があるため、それをオーバーライドして機能させたい場合は、次のようにする必要があります。

#homelink:hover a p {
color:#ff6600;
text-decoration:none;
}

ただし、タグ内にブロック レベルの要素を含めるべきではありません。ps をスパンに変更し、css でそれらをブロック要素として定義して意味的に正しくするか、a 要素をすべて一緒に削除して div からリンクしないのはなぜですか?

<div id="homelink" onclick="window.location='http://google.com';">
  <p><em>Lorum Ipsum</em><br>
    Lorum Ipsum</p>
   <p>Lorum Ipsum</p>
   <p>Lorum Ipsum<br>
    Lorum Ipsum</p>
</div>

CSS シートにスタイルを保持します。たとえば、次のようになります。

 #homelink p { text-align: center }
 #homelink:hover { color:#ff6600; text-decoration:none; }
于 2013-11-09T13:13:24.430 に答える
0

私はそれを回避することでそれを解決しました。wordpressサイトではなく、JSfiddleで機能した理由がわかりません（ただし、wordpressの場合はより多くの場合です;）。

WYSIWYG エディターをプレーン テキストに変更したため、

タグは自動的に返されず、問題は解決しました。

于 2013-11-09T13:14:05.453 に答える