Image Flex は他のデバイスに焦点を当てますが、私のラップトップには焦点を当てません
P粉270891688
P粉270891688 2024-02-17 20:18:55
0
1
366

Web ページを作成していて問題が発生しています。ページのフレックスに 4 つの画像が表示されています。[検査] をクリックして他のデバイスでどのように表示されるかを確認すると、一番上が表示されます。画像が 2 つあり、下部にさらに 2 つの画像があります。ここに画像の説明を入力してください

しかし、戻ってラップトップに表示すると、上部に 3 つの画像、下部に 1 つの画像が表示されます。ここに画像の説明を入力してください

常に最初の写真 (上に 2 つ、下に 2 つ) からの画像が表示されるようにするにはどうすればよいか考えています。

これは私のコードの一部です

ああああ

P粉270891688
P粉270891688

全員に返信(1)
P粉779565855

ブラウザは、幅 350 ピクセルまでの画像を 1 行に収めることができます。適合しない場合は、次の行に折り返されます。

フレックスボックス内の行ごとに常に 2 つの画像を表示したい場合は、画像の幅を画面幅の 50% に設定できます。両側に 5 ピクセルのパディングがあるため、次のように calc() 関数を使用して 50% からパディングを減算できます。 リーリー

以下はコードの例です:

リーリー リーリー
いいねを押す +0
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート