ホームページ > 記事 > ウェブフロントエンド > モバイル端末の基礎知識まとめ
1.単位(px、em、rem)
1.px:画面デバイスで物理的に表示できる最小のポイント。異なるデバイス上のポイントの長さと幅の比率は同じではない場合があります。 ;
2. em/rem: 似ている点: どちらも相対的なサイズ値です。異なる点: em は親要素に対して相対的であり、rem は html に対して相対的です (デフォルト値はブラウザーによって異なります。Chrome のデフォルトは 16px)。
レムユニットはモバイルフロントエンド開発で非常に人気があります。 rem ユニットには多くの利点があり、ルート ノードに関連しているため、Web サイト全体のユニットを統合できます。また、フォントを Web サイトのサイズに合わせて調整することもできます。ただし、使用するとわかるように、Chrome ブラウザーを使用して作成した Web サイトを開くと、フォントが大きく表示されることがあります。大きな状態。ただし、ページを更新してください。 このようなことが起こる理由は、計算の都合上、元々のデフォルトの 1rem=16px を 1rem=10px に変更したためです。そのため、通常は HTML で次の設定を行います:html{ font-size:62.5%;/*10÷16×100=62.5% 1rem=10px*/ }しかし、Chrome ブラウザーは時々無視します。 HTML 設定に問題があるため、ページを初期化すると、上記のフォントが大きすぎるように見えます。よく調べると、フォントが大きすぎる「要素」には通常、フォント サイズが設定されていないことがわかります。したがって、解決策は次のとおりです。表示したいテキストまたはその他のフォント サイズ自体を設定します。
2. ヘッダー情報:
1.DOCTYPE (ドキュメント タイプ): このタグは、ドキュメントに使用する html または xhtml 仕様をブラウザーに指示します。大文字と小文字は区別されません。HTML コード:nbsp;html><!-- 使用HTML5 DOCTYPE 不区分大小写 -->2.lang: この属性は、ドキュメントの言語タイプ (英語: en、中国語: zh など) を設定するために タグに配置されます。コード:
...3.charser:ドキュメントの使用方法を宣言 文字エンコーディング(GBK、UTF-8)、HTMLコード:
<meta>4.format-detection(識別ルール)→コンテンツパラメータ(デフォルトはyes) ): 電話: 番号はダイヤルアップ リンクに変換されます (はい/いいえ)—いいえ: 番号をダイヤルアップ リンクに変換することを無効にします、はい: 番号をダイヤルアップ リンクに変換することを有効にします 電子メール: 電子メールを識別します。はい/いいえ)——いいえ: メール アドレスとしての使用を無効にします。はい: テキストを有効にします。デフォルトはメール アドレスです。アドレス: アドレスをクリックして地図にジャンプします。いいえ: 地図へのジャンプを禁止します。はい:アドレスをクリックして地図にジャンプする機能を有効にします。
<meta>5.viewport (モバイルデバイス用) → content パラメータ: 幅: ビューポートの幅: ビューポートの高さ (通常は設定されていません);スケール: 初期スケーリング率; 最大スケール: 最大スケーリング率; 最小スケール: 最小スケーリング率; ユーザースケーリング可能かどうか (はい/いいえ)
<meta>6. SEO 最適化: ):
;
インデックス: 検索エンジンはこの Web ページのインデックスを作成します。フォロー: 検索エンジンはこの Web ページのリンク インデックスを通じて他の Web ページを検索し続けます。 2. ページを無視します。番号は電話として認識されます。番号 (iOS 端末で発生しやすい)<meta>3. ページ上のメールアドレスの認識を無視する (Android 端末で発生しやすい)
1.H5页面窗口自动调整到设备宽度,禁止用户缩放4. スクロールバーを上下に引くと途切れる
<meta>5.コピー禁止、テキストを選択
<meta>
以上がモバイル端末の基礎知識まとめの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。