CSS3 構文: (750 ピクセルのデザインの場合、1rem = 100 ピクセル) @media 画面のみで (最小幅: 320px) かつ (最大幅: 479px) { html{ フォントサイズ: 42.67px !重要; } } @media 画面のみで (最小幅: 480px) かつ (最大幅: 639px) { html{ フォントサイズ: 64px !重要; } } @media 画面のみで (最小幅: 640px) かつ (最大幅: 749px) { html{ フォントサイズ: 85.34px !重要; } } @media 画面のみで (最小幅: 750px) かつ (最大幅: 959px) { html{ フォントサイズ: 100px !重要; } } @media 画面のみで (最小幅: 960px) かつ (最大幅: 1241px) { html{ フォントサイズ: 128px !重要; } } @media 画面のみで (min-width: 1242px) { html{ フォントサイズ: 165.6px !重要; } } jsコントロール (zepto/jQuery) (750px デザインの場合、1rem = 100px) 関数setFont() { window_width を window.innerWidth とします。 font_size = parseFloat(window_width / 3.75); とします。 $('html').css('フォントサイズ', font_size); } $(window).on('resize', 関数() { フォントを設定する(); }); 要約する 上記は、CSS3 のメディア クエリと rem レイアウトを組み合わせて、携帯電話の画面に適応させる方法についてご紹介したものです。お役に立てれば幸いです。ご質問がある場合は、メッセージを残してください。すぐに返信いたします。 |
>>: ルート権限なしでログインするためのDockerソリューション
以前、UDP を使い始めるために簡単な UDP サーバーとクライアントの例を作成しましたが、実際に使...
データの昇順、降順ソート1. フィールド名による単一フィールドのソート順機能:どのフィールドを基準に...
目次1. HTML5のテンプレートタグ2. テンプレートタグ操作のプロパティとメソッド3. Vueの...
目次小さいけれど美しいシンプルにNULL値を避けるデータタイプを選択する手順データ型の紹介1. 文字...
1. JDKをインストールする コンピュータの動作桁を確認します。 uname -ar 2017 x...
Mysql が CPU を占有しすぎる場合、どこから最適化を開始すればよいでしょうか? CPU 使...
1. 仮想マシンの準備1. 新しい仮想マシンを作成する 2. 仮想マシンのカスタマイズを選択する 3...
実際には、対応する記述方法は多数ありますが、最も一般的なのは object + embedded で...
概要es6 では、配列またはオブジェクトから指定された要素を取得する新しい方法が追加されました。これ...
最近、HTML を再度学習しており、これは HTML に対する新たな理解と言えます。これを過小評価し...
序文PC サーバーは今日まで発展を続け、パフォーマンスにおいて大きな進歩を遂げてきました。 64ビッ...
1. MySQLに接続するフォーマット: mysql -h ホストアドレス -u ユーザー名 -p ...
コードをコピーコードは次のとおりです。 <!DOCTYPE html PUBLIC "...
例: <html> <ヘッド> <スタイル タイプ="tex...
フロントエンドで画像をアップロードする原理は、入力 type="file" タグ...