ケータイからのアクセス時のみ表示させるカスタマイズ

こんにちは。
アメブロ簡単カスタマイズの松田です。

前回の記事の続きになりますが、ケータイからのアクセス時のみ表示させる方法は、以下のソースをCSSに追記します。

.subContents .k-tai {
display:none;
}

以上です。（笑）

これは非表示にするという意味を持つCSSなのですが、これをCSSに追記しておいて実際にケータイからのアクセス時のみ表示したい内容を<div class="k-tai">と</div>で囲みます。
これだけでＯＫです。

では実際にやってみましょう。↓↓↓

ケータイからアクセスいただいた方、こんにちは。このテキストはケータイからアクセスした場合のみ表示されます。

はい。
パソコンからアクセスされている方はこの上には何も表示されていませんよね。＾＾
ですがケータイからアクセスされた方はある言葉が見えているはずです。

この仕組みを説明しますと、アメブロのCSSの設定はパソコン版のブログにしか取り込まれず、ケータイ版のブログでは適用されません。

これを逆手にとって、パソコン版のブログに非表示するCSSを書いておけば、パソコン版のブログでは非表示になりますが、ケータイ版のブログはこのCSSが無視されて普通に表示されるというわけです。

これをうまく利用すればパソコン版ではこの表示方法、ケータイ版ではこの表示方法といった表示の使い分けが可能になります。


何かの参考になれば幸いです。