在Bootstrap4中使用垂直居中


Bootstrap 是全球最受歡迎的前端組件庫,用於開發響應式布局、移動設備優先的 WEB 項目。Bootstrap 是一套用於 HTML、CSS 和 JS 開發的開源工具集。利用我們提供的 Sass 變量和大量 mixin、響應式柵格系統、可擴展的預制組件、基於 jQuery 的強大的插件系統,能夠快速為你的想法開發出原型或者構建整個 app 。

Bootstrap4下載地址:>>點我下載<<

在制作頁面時,當我們需要div或者圖片垂直居中時,可以在div中添加 樣式。
如下圖所示,每個卡片的左側圖片沒有垂直居中,然而我們需要它垂直居中。

這里寫圖片描述

圖1. 未垂直居中的效果

此時,我們在圖片的外層div中添加 樣式,如下圖所示,完成了我們的預期效果:
這里寫圖片描述

圖2. 垂直居中的效果圖


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM