異なる色で2つの異なる単語を作成するには、1つのdivで同じ色に変更しますか？

Question

誰でも私にこれを手伝うことができますか？ 私はdivを持っています、divの中にはイメージと2つの異なるテキストがあります。 div全体がリンクですが、divを上書きして両方のテキストを白に変更すると、異なる色の2つの単語にしたいと思います。

Answer 1

あなたはこれだけのアイデア任意のHTMLコードを与えていない（使用してjQueryの）

HTML

<div id="myDiv"> 
    <img src="http://gpsarakis.com/images/icon_jquery.png" /> 
    Hello World 
</div>​ 

JS

$(function(){ 
    var myDiv=$('#myDiv'); 
    var txt=myDiv.text().split(' '); 
    var theWord=txt[txt.length-1]; 
    myDiv.html(myDiv.html().replace(theWord, '<span class="red">'+theWord+'</span>')); 

    myDiv.hover(function(e){ 
     $(this).css('color','white').find('span.red').toggleClass('white'); 
    }, 
    function(e){ 
     $(this).css('color','black').find('span.white').toggleClass('white'); 
    }); 
});​ 

DEMO.

Answer 2

あなたはそのためのJSを使用したくない場合、あなたはこのような何か行うことができます。たとえば をあなたのHTML：

<div> 
    <img src='...' alt=''/> 
    <span class='first'>Your text</span> 
    <span class='second'>Your second text</span> 
</div> 

とスタイル：その

div:hover { 
    color: white; 
} 

div:hover .first { 
     background: red; 
} 
div:hover .second { 
     background: yellow; 
} 

利点はということですスパンで複数の単語を持つことができます。 @Sheikhはあなたの質問に対するコメントのようなものをあなたに提案しました。