html - 分割色のハイパーリンク

Question

<a href='www.stackoverflow.com'>Hello<font color='#c0c0c0'> World</font></a> 

「Hello」という単語は、ハイパーリンクの色で表示されます。そして、「ワールド」は #c0c0c0 色で表示されます。ただし、「World」にはハイパーリンクの色で下線が引かれています。「World」という単語に同じ色 #c0c0c0 で下線を引くにはどうすればよいですか? 元のハイパーリンクで「Hello」という単語の下線の色を保持します。

Answer 1

最後の単語を a<span>で囲み、目的のスタイルを適用してみてください -デモ

HTML

<a href='www.stackoverflow.com'>
    Hello <span>World</span>
</a> ​

CSS

a span { color: #c0c0c0; text-decoration: underline; }

IE7-9、Chrome、および FF でチェック済み - どこでも動作するようです