デバイスの向き画面サイズチェック
←アイコンの向きに注目!

デバイス情報

デバイスピクセル比
検出値
画面の幅
検出値
画面の高さ
検出値
画面の幅(有効領域)
検出値
画面の高さ(有効領域)
検出値
ウインドウの幅
検出値
ウインドウの高さ
検出値

「デバイス情報」はJavaScriptで取得しています。

Windowsタブレット上のIE 11やChrome/Operaでは、デバイスの回転(DeviceOrientationイベント)により、「画面の幅/高さ」の値が自動的に更新されます。このイベントが感知されないOSでは、ページの更新が必要です。

ウインドウ サイズと背景色

幅2561ピクセル以上
幅2560ピクセル以下
マゼンタ
幅1920ピクセル以下
幅1366ピクセル以下
シアン
幅1280ピクセル以下
幅1200ピクセル以下
幅1080ピクセル以下
オレンジ
幅1024ピクセル以下
クリムゾン
幅960ピクセル以下
幅800ピクセル以下
幅640ピクセル以下
カーキ
幅600ピクセル以下
グレー
幅480ピクセル以下
幅380ピクセル以下

ページの背景色は、ウインドウサイズを基にして、CSSのメディアクエリーで指定しています。その他のCSSを含め、IE 11もしくは他の最新ブラウザーであれば正しく表示されます。

内容を囲んでいる「frame」ボックスの幅は、一つ下のウインドウサイズ-64ピクセルです。たとえば、ウインドウサイズが「幅2560ピクセル以下」の場合は1920-64=1856ピクセルです。なお、最小幅の「幅380ピクセル以下」の場合は、316ピクセルです。

CSSのフレキシブルボックスレイアウトを使用しているため、これに非対応のIE 9ではレイアウトが崩れます。