無法與 CSS 對齊左、中和右

Question

無法根據 DIV 對齊左、中和右。 正如我在圖片中發布的那樣，我需要一個簡單的布局。

當我試圖糾正 alignment 時，它變得一團糟。

你能檢查一下並幫助我得到我想要的布局嗎？

我的代碼：

 body { background: #000000 50% 50%; overflow-x: hidden; overflow-y: hidden; }.video { width: 100vw; height: 100vh; display: grid; place-items: center; }.left { text-align: left; position: absolute; }.right { text-align: right; position: absolute; }

 <body> <div class="left"> <p style="color: blue;">Title</p> <img src="https://place-hold.it/336x280" /> <br> <p style="color: blue;">Title</p> <img src="https://place-hold.it/280x500" /> </div> <div class="video"> <img src="https://place-hold.it/500x500" /> </div> <div class="right"> <p style="color: blue;">title</p> <img src="https://place-hold.it/336x280" /> <br> <p style="color: blue;">Title</p> <img src="https://place-hold.it/280x500" /> </div> </body>

Answer 1

像這樣的東西？

 body { background: #000000 50% 50%; }.video { margin: 50px 20px; }.left { text-align: left; }.right { text-align: right; }.container { display: flex; flex-direction: row; justify-content: space-around; }

 <body> <div class="container"> <div class="left"> <p style="color: blue;">Title</p> <img src="https://place-hold.it/336x280" /> <br> <p style="color: blue;">Title</p> <img src="https://place-hold.it/280x500" /> </div> <div class="video"> <img src="https://place-hold.it/500x500" /> </div> <div class="right"> <p style="color: blue;">title</p> <img src="https://place-hold.it/336x280" /> <br> <p style="color: blue;">Title</p> <img src="https://place-hold.it/280x500" /> </div> </div> </body>

無法與 CSS 對齊左、中和右

問題描述

1 個解決方案

解決方案1
1 2022-09-03 15:13:35

無法與 CSS 對齊左、中和右

問題描述

1 個解決方案

解決方案1 1 2022-09-03 15:13:35

解決方案1
1 2022-09-03 15:13:35