2016.9.25 学習内容に関する雑記

通常の状況では、ネイティブ コードよりもブートストラップを使用してレスポンシブ レイアウトを作成する方が高速です

前回の記事「ブートストラップの実践」の補足:

ウェブ側では、さまざまなブラウザに適応するために互換性を持たせる必要があります。スプライト画像は複数のセットが使用される場合があります。

。

* モバイル版ではメタ ビューポートを追加する必要があります

ユーザーは追加できませんズーム可

携帯電話の様々な画面サイズに合わせたフォントサイズ変換

@media 画面と (min-width: 960px){html{font-size: 30px;}} @メディア画面と (max-width: 750px){html{font-size: 23.4375px;}}
@media 画面と (max-width: 640px){html{font-size:20px;}}
@media 画面と(max-width: 414px){html{font-size:12.9375px;}}
@media 画面と (max-width: 360px){html{font-size:11.25px;}}
@media 画面と (max -幅: 320px){html{font-size:10px;}}

画像を使用する場合は、img を div でラップし、img を本体上に裸のままにしないでください

最初は互換性の良いブラウザで Web ページを作成し、互換性の悪いブラウザには徐々に適応します

徐々に強化

ブートストラップのコンテナの幅は 100% に固定されています

位置固定属性がナビゲーションと末尾に適用されている場合、中央のコンテンツを配置するときは、位置決めを使用せず、マージンまたはパディングを使用して距離をサポートします。そうしないと、配置された要素が固定ナビゲーションの上に表示され、ナビゲーションがブロックされます。絶対的も相対的も使用できません。結果は自分でテストできます。