質問: 携帯サイトの表示について 携帯サイトを初めて作成したのですが、表示に以下の問題点があり、困っています。 ソースはpcサイト用のもの(html 4.1、タグ打ち)を流用、改変しています。 1.docomoの旧機種(2009年5月以前)で、文字サイズ、行間などのレイアウトが適用されない。 2.一部の携帯(機種不明)で、文章(文字のみで構成したファイル、最大35kb程度)が途中で途切れ、それ以上スクロールできなくなるらしい。 以下が、当該ページの冒頭~部分です。 自分の携帯電話softbank 942shでは、表示には全く問題がありません。 (keitai.cssの内容は、body、div部分と同じstyle指定です。これではdocomo旧機種に対応できないと知ったので、タグ内のstyleを追加しましたが、効果がないようです。) 問題点を御教授していただければ嬉しいです。
回答: サーバーがappacheであれば.htaccessを利用してhtmlのcontent-typeをapplication/xhtml+xml .htmlにしてやります。 addtype application/xhtml+xml .html これでとりあえずスタイルは適用できる状態になりますが、docomoの古い機種は行間の調整はかなり厳しいです。 というのも、line-heightは使えませんし、marginはimg要素にしか使えません。 ちょっと間違っているかもしれませんが、古い機種(多分iモードブラウザ1.0)で使えるプロパティと要素の一覧です。 background-image : body background-color : body, div, table, td, th, tr color : body, color, div, span border-color : td, th, tr font-size : body, color, div, span text-align : div, hn, p, td, th, tr margin-left : img margin-right : img margin-top : img margin-bottom : img width : td, th, tr height : td, th, tr vertical-align : img float : img, hr clear : blockquote, div, dl, form, hn, hr, ol, p, pre, ul list-style-type : ol, ul, li -wap-input-format : input, textarea -wap-marquee-style : div, span -wap-marquee-dir : div, span -wap-marquee-loop : div, span フォントサイズに関してもかなり厳しいと思います。私のやってた感じだと、3キャリア統一の時は毎回以下のようなタグを書いていました。今ではこれでは無理かもしれません。font要素のsize属性で大きさを調整します。style属性も毎回指定しなければ統一が取れなかったような・・・ テキスト 正直、pcサイトのhtmlをドコモ携帯に読ませたい場合はcssを完全に切る方が無難です。外部cssで@media handheldでも使って携帯用のスタイルを書いておけば、その他のブラウザでそこそこ表示できる機種のみにスタイル指定を絞ることができます。 2.はキャッシュオーバーじゃないでしょうか。 http://ke-tai.org/moblist/