問題タブ [ui-patterns]

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.

0 投票する
2 に答える
4995 参照

html - Flexbox レイアウト パターン: 5 正方形 (大 1、小 4)

私はフレックスボックスレイアウトをまとめようとしています - この質問の目的のために、私はそれを「四角い5つのブロック」レイアウトと呼びます (画像を参照) - しかし、私が試したすべての実験がそうであるように、私は問題に遭遇しています正しくラップされません。

フロートを使用して同じレイアウトが行われるのを見たことがありますが、将来的に少し保証し、より最新の方法を使用することを望んでいました-したがって、フレックスボックス。このパターンを検索してみましたが、一貫した名前がないようで、同様の例を見つけるのは困難です。

ビューポート単位も使用して、すべてビューポート幅 (vw) 単位に基づいて、ブロックが完全に正方形のままであることを確認します。

重要な機能は、すべてのブロックが正方形である必要があることですが、最初のブロックは残りの 4 つを組み合わせたサイズである必要があります。そのようなレイアウトを見たり、作業したりしたことのある人はいますか?

フレックスボックスを使用した完全な正方形の 5 ブロック グリッド。 最初のブロックは、残りの 4 つのブロックの正確なサイズにする必要があります

ありがとう!!