TAM Technical Team TipsNote

TAMテクニカルチームがテーマ別の技術グループに分かれて
「Tips Note」を、毎週更新します。

  • HTML・CSS
  • JavaScript
  • ActionScript
  • CMS
  • Mobile
  • SEO
  • Program
Tips Note > Mobile

今回はリンク色の設定について書きたいと思います。

ページ全体でリンク色を統一する場合、

<style type="text/css" media="handheld">
<![CDATA[
a:link{color:#4595D1;}
a:visited{color:#4595D1;}
]]>
</style>

とhead内に記述します。

もしデザインによって違う色にしたいなら、
このような記述で個別に指定する必要があります。

<a href="#"><span style="color:#FF0000;">リンク</span></a>

この「<span>」をaタグの外側にすると指定の色に変わりません。
このソースを実機で確認すると、テキストと下線が違う色で表示されます。
下線にはhead内で全体に指定したスタイルが効いているからです。

テキスト色と同じにしたい場合はa要素にスタイルを指定します。

<a href="#" style="color:#FF0000;"><span style="color:#FF0000;">リンク</span></a>

もしくは

<style type="text/css" media="handheld">
<![CDATA[
a:link{color:#4595D1;}
a:visited{color:#4595D1;}
a.lc01:link{color:#FF0000;}
a.lc01:visited{color:#FF0000;}
]]>
</style>

<a href="#"><span style="color:#FF0000;">リンク</span></a>

ただし、iモードブラウザ1.0で下線の変更はできないようです。

(投稿者:nagamatsu)
Comments: コメントはまだありません
この記事へのコメント

コメントはまだありません。

コメントを書く




コメント(必須)

※ブログオーナーが承認したコメントのみ表示されます。

Spam Protection by WP-SpamFree

関連サイト