レスポンシブ・表示崩れ / HTML5

2023年4月1日2023年4月3日サイト作成メモ

【レスポンシブ】

pictureタグ
レスポンシブに画像を切り替える
https://catnose.me/learning/html/picture

〇検索に使用したワード：
< html5 初心者レスポンシブ >

【入門】レスポンシブWebデザインとは？概要と作り方を丁寧解説
https://www.kagoya.jp/howto/it-glossary/web/responsive/

レスポンシブデザインとは？メリット・デメリットや作り方など徹底解説！
https://seolaboratory.jp/89410/

レスポンシブWebデザイン初心者におススメする本とサイト　時間短縮！効率化！
https://blog.skeg.jp/archives/2015/09/responsive-web-coding.html

レスポンシブWebデザインのHTMLとCSSの基礎と学習方法
https://blanche-toile.com/web/learn-html-css

【HTML＋CSS】ウインドウ幅に合わせて画像サイズを変化させる方法
https://allabout.co.jp/gm/gc/400630/#aa400630responsive-width

CSSだけ！レスポンシブなサイトの作り方と鬼ほど使うプロパティ
https://pecopla.net/web-column/how-to-responsive

CSSでスマホ対応！レスポンシブサイトの作り方と初心者向けQ&A
https://www.sejuku.net/blog/99964

【表示崩れ】

レスポンシブデザインでCSSが効かない場合に確認すること
https://www.beginnerweb.net/responsivetr.html

CSSが反映されない時にチェックすべき5つのポイントと解決方法
https://www.sejuku.net/blog/100015

〇検索に使用したワード：
< HTML5 レイアウト崩れる win10 >

表示が壊れたりレイアウトが崩れたりしているホームページの対処方法

1 htmlのタグ閉じ忘れ
2 htmlの入れ子ルールを間違う
3 レイアウトをスペースや改行で調整してしまっている
4 Webブラウザの大きさに対応していない
5 IEに対応していない
6 floatで崩れる
7 まとめ

Webページをマルチデバイスに対応させるには？レスポンシブコーディングの仕組みを解説
https://codezine.jp/article/detail/10928

[CSSハック]ブラウザによってレイアウトが崩れる対処法まとめ
https://qiita.com/sho11hei12-1998/items/c53de95122f8d7d38c4f

2023年4月3日

Posted by 赤池