俺流レスポンシブコーディング
俺流レスポンシブコーディングの覚書。「人には人のレスポンシブ」があるのでこれが正解だってわけではないのですが、レスポンシブコーディングで悩んでいる人にとって参考になる記事になってくれたら嬉しいです。 ブレイクポイントは特定のデバイスの画面サイズを基準にしない 以前アンケートを取った時にデバイスのサイズを意識して決める人が半数以上を占めていた。 アンケート結果を抜きにしても「2021 年のブレイクポイント決定版はこれだ！」的な記事がバズっているのを定期的に目撃し、主流のデバイスのサイズを比較するアプローチがほとんどであるが、僕はデバイスの端末のサイズを基準にブレイクポイントを決めることには否定的である。 主流のデバイスのサイズなんてものは時間が経てば変化する。 昨年 iPhone 12 が発表された時に従来の画面サイズとは違うバリエーションになることが分かるやいなやタイムラインが慌てふためい
Web開発におけるスマートフォンからの動作確認・検証の環境 - Qiita
はじめに スマートフォン対応しているWebサイトがもはや当たり前な世の中ですが、Web開発をしているとスマートフォンから閲覧したときの動作を確認をする機会が多いと思います。 そこで、どのような確認の方法があるのか、簡単にまとめたいと思います。 ブラウザからの動作確認 Chrome ブラウザ上で右クリック→「検証」→表示されたエリアの左上にあるスマートフォンアイコンをクリックするとスマートフォンから閲覧したときのような画面になります スマートフォンから閲覧したときみたいに、クリックしながら上下にスライドすると画面がスクロールされます Safari ブラウザの設定から開発者メニューが表示されるように設定します メニューの「開発」→「レスポンシブ・デザイン・モードにする」をクリックすると、スマートフォンから閲覧したときのような画面になります しかも表示されている機種を選択することで解像度を変更で
iPhone/iPad/iPad mini用メディアクエリ一覧 | ENTEREAL/エンタリアル
Blog Posts List ブログ記事一覧 検索 CakePHP3を始めた方に CakePHP 3.X 2016年01月16日(土) 14時23分 2つの住所から距離を計算する API 2015年12月18日(金) 10時23分 「:target」セレクタについて CSS 2015年12月12日(土) 12時23分 外部サイトからの画像への直リンクを防ぐ Apache 2015年12月04日(金) 12時23分 CSS3だけで作るブラウザタブ CSS 2015年11月17日(火) 21時23分 CSS3だけで作るパンくずに関する件 CSS 2015年11月12日(木) 12時23分 Bootstrap4のブレイクポイント計算機 Bootstrap 2015年11月11日(水) 19時23分 Bootstrap4のブレイクポイントに関する件 Bootstrap 2015年11月11日(水
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
初心者も分かる！レスポンシブ・デザインの作り方
