【静岡 Web designer 生活ブログ】

静岡市でフリーランスでウェブパレットという屋号でWebデザイナーしています。Webデザインしている上での備忘録的なブログです。たまにプライベートなことあり。

HOME > 静岡 Webデザイナー生活 > 備忘録:ipad iphoneだけに効かせるCSS対応

07/31
2010

備忘録:ipad iphoneだけに効かせるCSS対応

備忘録:ipad iphoneだけに効かせるCSS対応

Tweet
このエントリーをはてなブックマークに追加

最近Web制作をしていると、ipad、iphoneで見ると、画像が1pxずれてしまうことに悩んでいました。

画像単体なら、調整も聞くんですが、切り分けしてあるところなどでは、1pxのずれは結構汚く見えてしまうので、 どうしたものかと。

 

CSSハックも検索しても今のところ書かれてあるサイトはないんですよねー。

で、探していたら、cssファイルをipad用、iphone用とわけてあげることで、対応できることがわかりました。

◆iphoneには
<link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="iphone.css" type="text/css" />

◆ipadには
<link rel="stylesheet" media="only screen and (max-device-width: 1024px)" href="ipad.css" type="text/css" />

上記<>が全角になっているので、半角にしてくださいね。

あとは、直したい箇所のCSSをそれぞれのスタイルシートに書き出せばOKです。

Related posts:

  1. 備忘録:レスポンシブサイトでイメージマップを使う場合に便利な「jQuery RWD Image Maps」
  2. iPad,iphoneアプリ Blogpressで投稿
  3. ipad使ってます!
  4. USTREAM埋め込みを試してみる
Filed under: HTML&CSS&Javascript — 6:24 PM
← WordPress3.0 マルチサイトが使いやすいかどうか 備忘録:ビジュアルエディタでもHTMLでもよさげに使えるプラグイン →

Comment

  1. えど より:
    2010/08/01 3:39 PM

    はじめまして。
    ちょっと見ていて気になったのでコメントさせていただきました。
    iPadとiPhoneの指定って逆じゃないですかね?

    iPadのmax-device-widthが480pxってことはないと思うので・・。

    返信
  2. wakawaka67 より:
    2010/08/01 3:56 PM

    >えどさん

    ほんとですね、おもいっきり逆になってましたね(笑)
    失礼しました。
    修正させてもらいました。
    ご指摘ありがとうございます。

    返信

コメントをどうぞ コメントをキャンセル

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください。

  • 《ウェブパレットサイトへ戻る》

    ウェブパレット
  • 《広告》

  • PROFILE

      Name waka
  • SEARCH

  • PAGES

    • よく使うドメイン・レンタルサーバー
    • 使用プラグイン一覧
  • RECENT ENTRY

    • テスト
    • 備忘録:新サーチコンソールでのドメインプロパティ設定(DNSレコードでのドメイン所有権の確認)方法(エックスサーバーの場合)
    • 備忘録:WordPressで有料プラグイン「Elfsight Instagram Feed CC」をアップデートしたらなぜかSimple Tagsプラグインでエラーが出て困ったはなし
    • 備忘録:WordPressでテーマファイル修正の際に致命的なエラーが出る場合の対処法
    • 備忘録:FileZillaを使っていて文字化けしたフォルダが削除できない場合の対処方法
  • PAGE

    • よく使うドメイン・レンタルサーバー
    • 使用プラグイン一覧
  • CATEGORY

    • WordPress (71)
    • セミナー (19)
    • モバイル (1)
    • 仕事 (1)
    • カメラ (1)
    • Apple (11)
    • HTML&CSS&Javascript (6)
    • アプリ&ソフト&ハード (15)
    • SEO (4)
    • SNS (3)
    • プライベート (22)
      • ガーデニング (2)
      • 旅行 (2)
      • 車 (1)
      • つれづれごと (1)
      • 美術館 (1)
    • その他 (7)
  • ARCHIVES

  • TAG

    Contact form 7 CSS Nite CSS Nite in SHIZUOKA Different Posts Per Page FFFTP FileZilla Firefox Fireworks Fireworks8 Fireworks CS3 Flexible Upload Fotolia FTP function.php Gmail Google Google Chrome Instagram ipad iphone iphone4 iphone5s JavaScript jQuery LightBox Lightbox 2 MySQL pocket WIFI prettyPhoto Remote Testkit SNS Subscribe2 Windows WordBench WordBooker WordCamp WordPress Wordpressプラグイン wp-jquery-lightbox WP-RSSImport イーモバイル エックスサーバー セミナー 写真素材 素材
  • 《運営》

    ウェブパレット
  • 《その他運営しているサイト》

    しずおかはなさんぽ

    静岡わんわんさんぽ

    静岡おいしいかわいいグルメ&雑貨屋ブログ

    Home Office & Flower Life

  • META

    • ログイン
    • Comments RSS
    • Valid XHTML
    • Software
    • XFN
    • WP
    • RSS
  • @wakawaka67さんのツイート
  • 《広告》

Copyright © ウェブパレット All rights reserved.