[CSS]Media Queries（メディア クエリ）を使用したデバイスごとの指定方法のまとめCSS3のMedia Queries（メディア クエリ）を使用して、デスクトップのブラウザ用をはじめiPhone, iPadなどのモバイル用にスタイルシートを分けるためのフレームワークを紹介します。 Hardboiled CSS3 Media Queries [ad#ad-2] スタイルシートの分け方は2種類あります。 プロパティ単位 ファイル単位 プロパティ単位でデバイスごとにスタイルシートを設定 「/* Styles */ 」の箇所にスタイルシートを記述。 スマートフォン（（縦長・横長）
サイト制作の前に知りたいiPhone/Androidの仕様 (2/4)
■Mobile Safariの制限 Mobile Safariは、ハードウェアの制限などからMac版、Windows版とはいくつかの違いもあります。 ・プラグインに非対応 ブラウザーの機能を拡張するプラグインが追加できません。特にアドビ システムズの「Flash Player」をインストールできないため、Flashコンテンツを表示できない大きな制限があります。ほかにも、マイクロソフトの動画ファイル形式である「Windows Media Video」の埋込みや、QuickTimeムービーのページ内再生などもできません。これらは、HTML5やYouTubeなどで対応することになります（詳しくは今後の連載で紹介します）。 ・設定項目が少ない Mobile Safariは、［設定］［Safari］から設定画面を呼び出せますが、デフォルトの検索エンジンやセキュリティの設定などの項目しかありません。P
iPad（iPhone）の困った仕様
iPadのSafariでは、スクロールバーという物が表示されません。（iPhone向けにサイトを開発してきた人には耳タコの事実なのでしょうが） スクロールバーが出る場所というと、こんなところでしょうか。 （１）ページ全体 （２）divでoverflow:scrollなどの指定をしたとき（３）flame、iframe （４）textarea （１）は製作側にはあまり関係ないです。 使う分には若干不便かもしれませんが、iPadのスクロールは操作感が良いので、それほど問題となりません。 （２）の場合、スクロールバーが出ませんが、２本指でなぞると、スクロールします。 この動作を知っている人がどれだけいるのでしょうか。仮に知っていたとして、特定の場所でこの動作が必要だと分かる可能性がどれくらいあるでしょうか。 divのスクロールは使ってはいけない、と思った方が良いのだと思います。この時点でめんどくさ
【レポート】黄金比でどのスクリーンにも適したデザインを「Less Framework 3」 | エンタープライズ | マイコミジャーナル
Less Framework is a cross-device CSS grid system based on using inline media queries. iPhone、iPad、PC、Androidベースのスマートフォンやタブレットデバイスなど、インターネットを利用するデバイスの多様化が進んでいる。スクリーンサイズの異なるデバイスで動作するブラウザ向けにそれぞれ最適化されたWebデザインを提供するテクニックのひとつに、CSS3で策定が進められているメディアクエリを使う方法がある。このテクニックをベースにして開発されたCSSフレームワークのひとつにLess Framework 3がある。 Less Framework 3は、言ってしまえばデバイスのスクリーンサイズや表示領域サイズに応じて幅を変更するシンプルなフレームワークだ。Less Framework 3のサイトにアクセ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
スマートフォンブラウザ不具合特集
