問題タブ [viewport-units]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
responsive-design - モバイル Web サイト / ハイブリッド アプリの最も適切なサイズ測定基準は何ですか?
私はデスクトップでpxを使用し、時にはemを使用することに慣れています(レスポンシブ インターフェイスを開発するときになぜ px が最適なのかわかりませんが)。
私の懸念は次のとおりです。モバイル向けに開発する場合、 px、viewport units (vh、vw) などを使用する必要がありますか?
jquery - 入力を入力すると、モバイルでページが上にスクロールしますか?
私は 1 ページの Web サイトを作成しています。各セクションはビューポート全体の高さと幅 (100vw & 100vw) を占有します。モバイル画面の場合、コンテンツが収まるようにメディアクエリを使用して高さを調整しました。問題は、1 つのセクションにユーザーが入力を入力すると、ページが上にスクロールするか、下にスクロールすることがありますか?
なぜこれが起こっているのか分かりませんか？
このフォームの HTML は次のとおりです。
このセクションの CSS は次のとおりです。
Web サイト自体へのリンクは次のとおりです: http://www.a1phantom.com/
css - ビューポートの高さ/幅は小数値を返しますか?
通常、ビューポートの高さは整数値を返します。ただし、小数点以下2桁の値を返すことに気付きました。
ビューポート単位が丸められる理由/方法は?
(さらに、ブラウザ ウィンドウのサイズを変更していませんが、100vh が 616px を返すこともあれば、616.36px を返すこともあります)
css - スクロールバーなしでビューポート幅 (vw) を計算することは可能ですか?
vwタイトルにもありますが、cssのみでスクロールバー無しで計算することは可能でしょうか？
たとえば、私の画面の幅は1920px. vw返品1920px、素晴らしい。しかし、私の実際の身幅は1903px.
css のみで値を取得する方法はあります1903pxか (の直接の子だけでなくbody)、またはこれには絶対に JavaScript が必要ですか?
css - アスペクト比を維持しながら、ビデオの埋め込みサイズを特定のビューポートの高さに設定する
ビデオをレスポンシブに埋め込むためのソリューションはたくさんありますが、ビューポートの高さでビデオの埋め込みサイズを設定するソリューションを見つけることができませんでした。
ページには、ヘッダー、Youtube 埋め込み、フッターの 3 つの要素があります。ヘッダーとフッターは静的な「高さ: 15vh;」に設定されています。Youtube の埋め込みを 70vh にし、幅がオーバーフローすることなく 16:9 のアスペクト比を維持する必要があります。
繰り返しますが、埋め込みサイズを幅で設定するソリューションを探しているわけではありません (例: padding-bottom: 56.25% メソッド)。
何かご意見は？
ありがとう！
[編集: これは重複した質問ではありません。他の質問で提供される解決策は、指定されたビューポートの垂直方向の高さ (70vh) との比率でサイズ変更する幅を探しているのに対し、100% 幅を指します。]