iPodおよびiPhoneSafariのCSS最適化

ipodtouchとiphoneiPodまたはiPhoneの使用に最適化されたアプリケーションを構築することは、爆発的な市場に参入するための優れた方法です。 1億ダウンロード to date. It's important to realize that those numbers don't include browser-based applications that are optimized for Safari on iPhone or the iPod Touch and require no download.

今日は弾丸を噛んで購入しました 16Gb iPod Touch Safariとアプリの両方のプラットフォームのチェックを開始します。 確かに…外出先で映画を見ることができ、iPodTouchがAppleTVのリモコンとしても機能することに興奮しました。

手元にある私の最初のタスクは、 給与計算 for use with Safari on the iPod Touch or the iPhone. It's an application I've built in virtually every language… so it's time that I began learning development for Safari and learning the Apps framework.

Interestingly enough, bringing up the page in Safari didn't automatically utilize the メディア=ハンドヘルド css設定なので、適切なスタイルシートを使用するには、PHPでサーバーサイドスクリプトを作成する必要がありました。


> link rel = "stylesheet" media = "screen" href = "iphone.css" type = "text / css" />
>?php} else {?>
> link rel = "stylesheet" media = "screen" href = "style.css" type = "text / css" />
>?php}?>

I've got the page looking pretty good, but I know there's a ton of iPhoneとiPodSafariのCSS引数 I can utilize, even shifting components based on whether the page's orientation is landscape or portrait. I'll continue to experiment!

iPhoneまたはiPodTouchをお持ちですか? 試してみてください 給与計算 そしてそれがあなたのためにどのように見えるか私に知らせてください! ページ間の実質的にすべての変更はCSSのみで行われたことに注意してください! まったく新しいページを書くほうが簡単だったかもしれませんが、それほど難しいことではありません。

3のコメント

  1. 1

    ダグラス-

    iPhoneのCSSのヒントをありがとう…これは、モバイルブラウザを使用するBlackberryやその他のスマートフォンでも同様でしょうか。

    • 2

      こんにちはケン、

      いいえ–ほとんどのモバイルブラウザは media =” handheld” css指定。 ただし、iPodtouchまたはiPhoneのSafariはそれを無視します。

      ダグ

  2. 3

    私は自分でiphoneを手に入れなければなりません、私はipodtouchさえ持っていません。 私はCSSやもので迷子になるつもりですが、コードのあるものはすべて私のリーグから外れています笑

どう思いますか?

このサイトはAkismetを使用して迷惑メールを減らします。 コメントの処理方法を学ぶ.