«Prev || 1 || Next»

携帯のCSS

「携帯もCSSに対応しているんだ!」・・と数日前にしったばかりなんですが「じゃあ、どこまで対応しているんだろう?機種に寄って違うんだろうか?」って事で悩んでネット検索

とても良いサイトが見つかった!(抜粋)
サイト名:携帯でCSSを用いる場合

携帯端末におけるCSSの反映は、そのブラウザやバージョンによって異なっています。

auでのCSS

  • HTML/XHTML共にCSSに対応している。
  • link要素による外部CSS、style要素、style属性、全てが有効。
  • セレクタはclass/id指定が有効。
  • "text/html"を推奨しているが、"application/xhtml+xml"も比較的新しい機種では対応している。ただし、文字コードは"shift_jis"が安全です。

i-modeでのCSS

  • CSSを反映させたい場合はXHTMLで文書を作成する。
  • link要素による外部CSSは無効、style要素には、【a:link、a:focus、a:visited】、を指定できるが、これ以外は無効。基本的にstyle属性で記述。
  • class|id指定は無効。
  • MIMEタイプは"application/xhtml+xml"、"text/html"では反映されない。
  • 対応機種はFOMAのみ。(ユーザーエージェントにDoCoMo/2.0が含まれ、D2101V、P2101V、SH2101V、T2101V、N2001、N2002、P2002を除く機種)
  • iモードブラウザ2.0に関しては、この限りではありません。

SoftBankでのCSS

  • 基本的に、SoftBank3G機種では、HTML/XHTML文書、どちらも対応している。
  • link要素による外部CSS、style要素、style属性、全てが有効。
  • セレクタによるclass/id指定が有効。
  • "text/html"を推奨しているが、"application/xhtml+xml"も比較的新しい機種では対応している。
  • 旧VodafoneとSoftBankでは若干CSSに関する解釈が異なっており、J-PHONEではJ-PHONE/5.0/からXHTML文書でCSSを用いることができる。

これによるとi-modeはもうチョイみたいだ(平成21年5月より対応機種が出てるらしい)
「外部CSSが使えない」ってのは厳しいなぁ・・
それに私のau携帯だと、display-noneが使えないのである(早い話が丸見え)

これからすると、HTMLタグでマークアップして「i-mode1.0はここまで表示」にしておいて、auとかsoftBankなんかは外部CSSで見栄えを調整するのが良さそうだ
きっと来年は事情が違っているんだろうな(ショートメールも全社共通にして欲しい〜)

2009年10月20日:DW::zizodo

CSSでメディアの切り分け

前々から作っていたページに

  • 印刷用
  • 携帯用

とメディア毎に画面表示を振り分けるようにCSSのリンクを張った

  • print
  • handheld

CSSのmediaでかき分けブラウザでCSSの有無や選択で表示させてみる

  • 「print」
    画像:印刷用
  • 「handheld」
    画像:携帯用
  • au携帯
    画像:auより

う〜ん・・・携帯用(handheld)をauで見てみたら、ブラウザと表示が違っていた
矢印部分の数字が指定した大きさなのに、それができていない
途中からは無視されてるみたいだ?
ブロックで非表示にした項目も見事に表示されているし?
この点、もう少し掘り下げてみる必要がありそうである

2009年10月20日:DW::zizodo

«Prev || 1 || Next»

サイトナビゲーション

新着記事
携帯のCSS(10/20)
CSSでメディアの切り分け(10/20)
Twitter
Fri, 10 Sep 2010 03:36:10 +0000@UlyssesUlysses う〜ぬ・・・微妙なトコです。このまま書き込みが途絶えたら「あ〜あ」と思って笑ってやってくださいw (9月10日12時36分)

検索

ログイン

リンク

SKITEM DESIGN WORKS