-1
A
回答
1
嘗試下面的代碼
.textBox{display: flex;align-items: center;justify-content: center;}
.cont-bx1{background-color:#9f2f1f; color:#ffffff; text-align:center; min-height:200px; font-weight:bold; border: 1px solid #ffffff;}
.cont-bx2{background-color:#ef9030; color:#ffffff; text-align:center; min-height:200px; font-weight:bold; border: 1px solid #ffffff;}
.cont-bx3{background-color:#df6221; color:#ffffff; text-align:center; min-height:200px; font-weight:bold; border: 1px solid #ffffff;}
.cont-bx4{background-color:#df6221; color:#ffffff; text-aligncenter; min-height:200px; font-weight:bold; border: 1px solid #ffffff; }
.cont-bx5{background-color:#9f2f1f; color:#ffffff; text-align:center; min-height:200px; font-weight:bold; border: 1px solid #ffffff;}
.cont-bx6{background-color:#9f2f1f; color:#ffffff; text-align:center; min-height:200px; font-weight:bold; border: 1px solid #ffffff;}
.cont-bx7{background-color:#ef9030; color:#ffffff; text-align:center; min-height:200px; font-weight:bold; border: 1px solid #ffffff;}
.cont-bx8{background-color:#df6221; color:#ffffff; text-align:center; min-height:200px; font-weight:bold; border: 1px solid #ffffff;}
<div class="col-lg-12">
<div class="col-lg-4 cont-bx1 textBox">Lorem ipsum dolor sit amet, consectetur adipiscing elit</div>
<div class="col-lg-4 cont-bx2 textBox">Lorem ipsum dolor sit amet, consectetur</div>
<div class="col-lg-4 cont-bx3 textBox">Lorem ipsum dolor sit amet, consectetur adipiscing</div>
</div>
<div class="col-lg-12">
<div class="col-lg-6 cont-bx4 textBox">Lorem ipsum dolor sit amet, consectetur adipiscing elit</div>
<div class="col-lg-6 cont-bx5 textBox">Lorem ipsum dolor sit amet, consectetur adipiscing</div>
</div>
<div class="col-lg-12">
<div class="col-lg-4 cont-bx6 textBox">Lorem ipsum dolor sit amet, consectetur adipiscing elit</div>
<div class="col-lg-4 cont-bx7 textBox">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do</div>
<div class="col-lg-4 cont-bx8 textBox">Lorem ipsum dolor sit amet</div>
</div>
1
相關問題
- 1. 垂直對齊文本在流體div
- 2. 在div中垂直對齊文本
- 3. 垂直對齊DIV
- 4. 垂直對齊div
- 5. 垂直對齊SlickGrid頭垂直文本
- 6. 右對齊TabControl上的垂直文本
- 7. 垂直對齊圖像上的文本
- 8. UITextView文本垂直對齊
- 9. CSS:垂直對齊文本?
- 10. 垂直對齊文本
- 11. CSS - 垂直對齊文本
- 12. 垂直文本對齊
- 13. 垂直對齊線條上方的div
- 14. 使用垂直對齊css垂直對齊文本
- 15. 對齊兩個div垂直
- 16. 始終垂直對齊DIV
- 17. 垂直對齊div(無表)
- 18. html div垂直對齊
- 19. 垂直對齊浮動div
- 20. 垂直對齊div中的div
- 21. 在絕對定位的div中垂直對齊文本
- 22. 文本左對齊和垂直中心div div
- 23. HTML:在div中垂直對齊div
- 24. 在父div中垂直對齊div?
- 25. 將文本垂直對齊VisualStyleElement.ToolTip.Standard.Normal的VisualStyleRenderer
- 26. 垂直對齊標籤中的文本
- 27. WPF TextBlock中的文本垂直對齊
- 28. 垂直對齊NSTableView行中的文本
- 29. 浮動文本的垂直對齊
- 30. 垂直對齊的HTML列表文本
共享代碼... – Santhoshkumar
[鏈接] https://jsfiddle.net/gkc2xg11/ – Raj
目前我使用了填充和最小高度屬性。但是每個分辨率的對齊方式不同 – Raj