我正在使用帶有引導程式的塊按鈕，v5.1并且我曾經 d-grid使我的按鈕具有回應性。
<div class="d-grid ">
<button class="btn btn-primary" type="button">Button</button>
</div>
我想知道d-grid這里有什么作用，因為我找不到任何有關此的檔案。
uj5u.com熱心網友回復：
類的 d- 部分是顯示實用程式類的一部分。這通常會更改 CSS 顯示屬性的值：https : //getbootstrap.com/docs/4.0/utilities/display/
在您的示例中， d-grid 類使 div 元素成為一個網格容器，它是 CSS 網格布局的一部分。見這里：https : //www.w3schools.com/css/css_grid.asp
看起來 Bootstrap 5 不支持“grid”值，它是 CSS 的舊舊值。應將其更改為以下值之一：
無 inline inline-block block table table-cell table-row flex inline-flex
uj5u.com熱心網友回復：
"D-" 是 Bootstrap 的一種實用程式，可直接影響 Display 并幫助您進行網格布局。在 Css 中，我們稱之為“顯示”。
它是如何作業的：
.d-{value}
例子 ：
CSS: display: inline-flex;
Bootstrap: d-inline-flex
所有的價值觀
*沒有任何
排隊
行內塊
堵塞
桌子
表格單元格
表行
柔性
行內彈性*
關于網格：
CSS 網格布局擅長將頁面劃分為主要區域，或根據 HTML 原語構建的控制元件的各個部分之間定義大小、位置和層之間的關系。
與表格一樣，網格布局使作者能夠將元素對齊到列和行中。但是，與使用表格相比，使用 CSS 網格可以實作或更容易的更多布局。例如，網格容器的子元素可以定位自己，以便它們實際上重疊和分層，類似于 CSS 定位元素。更多資訊來源：
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout
https://getbootstrap.com/docs/4.0/utilities/display/
https://www.w3schools.com/css/tryit.asp?filename=trycss_grid_display_grid
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/407510.html
標籤：
上一篇：如何打破引導表內的行？
下一篇：導航欄中右側的文本不顯示