携帯電話で使う事の出来るカスケーディングスタイルシート(CSS)のセレクタ及びプロパティを解説します。
また、
も別文書・携帯電話向けのCSSを書くに当たってに移転しました。
EZウェブ及びソフトバンクの現行機は、WAP 2.0に準拠しているため、CSSを使う事が出来ます。
但し、携帯電話のCSSには幾つかの制限があります。
また、実際にはWAP 2.0の仕様を忠実に実装していないようです。
尚、iモード端末も現行フォーマ端末ではCSSに対応していると言われておりますが、実際に利用するに当たっては他のキャリアとは全く異なる条件があり、このため今もCSSには対応しているとは言えません。
オペラやネットフロントなどのフルブラウザについても、CSSに対応しているものがあります。
特にイー・モバイル機やウィルコム現行ウェブ対応機は、全てCSS対応のフルブラウザを実装しております。
但し、フルブラウザはPC向けフル規格ウェブコンテンツの閲覧を前提としているので、WAP 2.0向けのCSSでのセレクタやプロパティに関する制限は概ね取り払われる事になります。
だからと言って、WAP 2.0の枠から外れたプロパティを利用すると、
それぞれ閲覧の障害になり得る事が予想されます。
WAP 2.0でCSSの仕様からあるプロパティが省略されるのには、それなりに理由がある筈だと言う事です。
その意味でも、WAP 2.0向けのCSSで解説しているプロパティのみを利用するようにするのが賢明と言えるでしょう。
携帯電話専用のCSSを当てるには、スタイルシートをリンクする<link>要素において、「media="handheld"」属性を追加します。
これに依り、PCは当該スタイルシートを無視します。
逆にPC向けスタイルシートを携帯電話で読み込まないようにするには、当該スタイルシートをリンクする<link>要素において「media="screen, projection "」属性を当てておきます。
handheldメディアとして扱っていますが、標準規格に依れば携帯電話ブラウザはttyメディア(等幅文字のみに依る画面)とも解釈出来ますので、携帯電話向けはhandheld, ttyメディアとした方が良さそうです。screenメディアとして扱っていますが、オペラのフルスクリーンモードはprojectionメディアとしております。従って現状ではPC向けのCSSはscreen, projectionメディアとすべきです。こうする事でCSSの実装に大きな問題を抱えているネットスケープ 4.xでも当該スタイルシートを無視するようになります。具体的には、HTML文書のヘッダには以下のように書けば良い事になります。
<link rel="stylesheet" type="text/css" href="携帯電話専用CSSファイルのURI" media="handheld, tty" /> <link rel="stylesheet" type="text/css" href="PC専用CSSファイルのURI" media="screen, projection " />