我想有 2 行：第一行是 4span，下面有一個帶有文本框的標簽。第二個 8 帶有下面的標簽和文本框。
然后在第二行有一個 12 跨度，一個按鈕跨越整個事物。我已經包含了一個關于我想要它的外觀和我正在使用的代碼的影像。
<div class="row">
<div class="col-md-4">
<asp:Label runat="server" Text="Merchant:" Width="100%"></asp:Label>
<asp:DropDownList ID="comMerchants" runat="server" Width="100%" AutoPostBack="true"/>
</div>
<div class="col-md-8>"
<asp:Label runat="server" Text="Enter Pass Serial (GUID):" Width="100%"/>
<asp:TextBox ID="txtGUID" runat="server" Width="100%"/>
</div>
<div class="col-md-12">
<asp:Button ID="Button1" runat="server" Text="Button" width="100%"/>
</div>
</div>
uj5u.com熱心網友回復：
問題是，當您使用 Bootstrap Grid 行時，如果可能，該行 div 中的所有內容都將布置在一行中。
您的按鈕具有 col-md-12 類，這意味著它將占用 12 列用于顯示小于或與中等顯示大小大致相同的顯示。
如果您要撰寫 col-12，它將用完所有螢屏尺寸上的所有 12 列。但 col-md-12 不會。寫入寬度 100% 做一件事。它用完行的列的剩余部分
為了更好地理解引導網格，我建議：
使用 Bootstrap Grid 創建回應式布局 作者：Shawn Wildermuth - 在 Multiplesight.com
或者查看 Bootstrap 本身的檔案。 https://getbootstrap.com/docs/4.0/layout/grid/
uj5u.com熱心網友回復：
您可能也想使用引導程式來設定表單元素的樣式，否則您只是在與框架作斗爭。
因此，您的按鈕可能需要一個 btn 類，然后是 btn-default（或類似的），然后您可以使用 btn-block 使其顯示塊而不是行內。
這將使其 100% 為容器的寬度。
如果您真的想要100%，那么您還需要從包含列中洗掉填充，我不記得您是否可以在 bootstrap3 中執行此操作，但您可以輕松地使用自己的 CSS。
像這樣
這里的主要內容是按鈕上的 btn、btn-default 和 btn-block 類。
<button type="Button" ID="Button1" class="btn btn-default btn-block">THIS IS A BUTTON</button>
在上面的小提琴中，我已將您的服務器控制元件轉換為 HTML 以使其在瀏覽器中正確呈現，并且我已將樣式應用于列、按鈕和 div（將輪廓設為紫色以使其更易于查看）。
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/392227.html
標籤：C＃ html 网站 bootstrap-3
下一篇：如何在導航上準確地將串列項居中？