スマートフォンに モバイル CSS 適用させること[原文]

Posted by Jen in coding front-end, trends on December 9th, 2009

(訳者 株 : 当然, 私は 専門 視訳者が ない. そのため 誤役が ある 数 ある. 原文の リンクは クリア ボスで 得た. 原文と 比べて 見れば 意訳が 多いという ガール 卵 数 ある でしょうに, 翻訳 実力が 足りない だから そんな ことだ;;)

私が モバイル CSSに 大海 話す 時, 私は アイフォーンの サファリ, ブラックベリーの 基本 ブラウザー, そして 新製品だが 多い これらが 使うように なる オペラ ミニを 思い浮かぶ.(原文は これだ : I am looking for safari in iphone, blackberry default browser and this new born but the mobile browser for majority to be – opera mini.)

今日, 3世代 フォンにも かかわらず スマートフォンは アメリカ 市場で 仮装(家長) 重要な 市場を 形成して ある. ところが 不幸にも デスクトップ コンピューターとは ダリ モバイル ウェブは 国際 標準が ない. 結局, モバイル用 ページを デザインする 時, ブラウザー 互換性と 接近性を 解決すること のために 普通 もっと 多い 努力を 入れると する. そして おこがましくも, 大部分の スマートフォンは 自分を handheld 這うことに 見做すの ない. そのため これ “handheld” CSS 宣言が まともに 作動するの ない.

<link media=”handheld” href=”mobile.css” type=”text/css” rel=”stylesheet” />

まず, アイフォーン 基本 ブラウザーである サファリ.

当たる, アイフォーンは 皆に すべてが 易しく 作られて ある. 消費者だけ なく アイフォーン オプル 開発者も [アイフォーン用 作業を することは] ウェブデザイナー程 易しい. ^^ そのため アイフォーンに 近付く 蟹 違う スマートフォン 這うのに 近付く より ずっと 簡単だ.

<link media=”only screen and (max-device-width: 480px)” href=”mobile.css” type=”text/css” rel=”stylesheet” />

自らを handheld路 ここは 器機たちを 含むこと のために, これ ラインを もうちょっと 一般的に 作動するように 直して 見よう.

<link media=”handheld, only screen and (max-device-width: 480px)” href=”mobile.css” type=”text/css” rel=”stylesheet” />

もうちょっと 安全に, たいてい 番(回) もっと 作業を 日 走者. 器機の 横 サイズが 320ピクセルや 彼 下である 場合にも 作動するように. それを ため こんなに 日 与える.

<link media=”handheld, only screen and (max-device-width: 320px)” href=”mobile.css” type=”text/css” rel=”stylesheet” />
<link media=”only screen and (max-device-width: 480px)” href=”mobile.css” type=”text/css” rel=”stylesheet” />

これ 二 ラインを 入れれば どこででも 完璧に 作動を する. 団, W3C CSS validator万 抜いて. そうだ. W3C増えた モバイル style ラインを 考慮するの ないうえ 検証(validation)を 通過させて 与えるのも ない. 思っては 対応法を 言うの ないだろう. もっと 多い 情報を 得ようとすれば, ここを 紫 : http://csscreator.com/node/28171

ブラックベリー 基本 ブラウザー

ブラックベリーは どうな 式で セッティングを 日 おいても モバイル スタイルシーツを 認知するの ない.[そのまま デスクトップ cssを 使って 捨てる.] handheld路 しても, 横 480pxおこるが 320px路 日 おいても 同じだ. ブラックベリー[路 入って来た ユーザー]に モバイル ページを 見えて 週期 ため ぴったり たいてい 枝 方法が ある. ジャバスクリプトを 利用して ブラックベリーに モバイル用 ページを 見えて 与える のだ. [そうしようとすれば ブラックベリーを 認知する] スクリプトを 違う 作動する スクリプトたちより もっと 先方に おいてなの する. 私は ページ 移動 なく モバイル スタイルシーツを 適用すること ため 努力したが, 不幸にも 作動するの なかった. もっと 詳細な 内容を 見よう.

<script type=”text/javascript”>
var deviceBB = “blackberry”;
//Initialize our user agent string to lower case.
var uagent = navigator.userAgent.toLowerCase();
var cssFile = “mobile.css”;
//**************************
// Detects if the current browser is a BlackBerry of some sort.
if (uagent.search(deviceBB) > -1) {
//document.getElementById(’blackb’).href = ‘mobile.css’; // this doesn’t work
window.location = ‘home_bb.html’;
//document.write(’<link href=”‘+cssFile+’” type=”text/css” rel=”stylesheet”>); //this doesn’t work either
}
</script>

オペラ ミニ

この子は 大部分の スマートフォン ブラックベリー, アイフォーン, treo palm など で 作動する 本当 良い モバイル ブラウザーだ. モバイル CSSを これ オペラ ミニに 認識させること ため, 次 二 ラインなら 十分だ.

<link media=”handheld, only screen and (max-device-width: 320px)” href=”mobile.css” type=”text/css” rel=”stylesheet” />
<link media=”only screen and (max-device-width: 480px)” href=”mobile.css” type=”text/css” rel=”stylesheet” />

オペラ ミニ シミューレーター サイトが ある. http://www.opera.com/mini/demo/ 思っては モバイル フォン なしにも モバイル CSSを テストして ボール 数 ある. しかし ‘誤った’(FALSE) 結果だけ 見えて 与える. そうだから テスト用で 使う ないで. 寝るのが 持って ある モバイル フォンに 直接 オペラ ミニ(it)を 設置して 実際で フォンで(there) テストを 日 見ると する.(これ 部分は まともに 翻訳した のか まどろみ 自分 ない.)

シミューレーターで ボール 数 ない, 本当 フォンで ボール 数 ある 問題(Issue)街 ある :

オペラ ミニは CSSで font sizeを 認識するの ない. これは 私が ウィキペディアで 持って来た 文章だ : オペラ ミニは 汚職 たいてい 種類の フォントだけ 支援する. これ フォントは 字面大きさで “Small”, “Medium”, “Large”と “Extra large” サイズだけ 支援する.

http://en.wikipedia.org/wiki/Opera_Mini

フォントの 基本 サイズは “medium”だ. これ 問題を 把握したら, モバイル スタイルを デザインする 時, もし オペラ ミニ ブラウザーを 念頭に 置いたら, あらゆる テキスト サイズを mediumで おいて ページを そこに 合わせると する.

- コメント機能はありません。コメントの代わりに[email protected]にメールを送ってください。