1
我使用引導程序3網格來設計具有3列的網頁。網格定義如下:如何將引導程序3模式寬度設置爲網格列
<body>
<div class='container-fluid'>
<div class="row">
<div class="col-xs-1"></div>
<div class="col-xs-10">
<form action="#">
...
</form>
</div>
<div class="col-xs-1"></div>
</div>
表單中有一個按鈕。點擊該按鈕後,會顯示Bootstrap模式。
模態定義如下:
<div id="add_element_modal" class="modal fade">
<div class="modal-content">
<div class="row">
<div class="col-xs-3"></div>
<div class="col-xs-6">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">Add Data Element</h4>
</div>
<div class="modal-body">
<h4>Specify Element Type</h4>
<div class="radio">
<label>
<input type="radio" name="element_type" id="et_q" value="v1" checked>Option 1
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="element_type" id="et_ft" value="v2">Option 2
</label>
</div>
</div>
<div class="col-xs-3"></div>
</div>
</div>
<div class="modal-footer">
<button type="button" data-dismiss="modal" class="btn btn-default">Cancel</button>
<button type="button" class="btn btn-primary" id="btn_add_element">Submit</button>
</div>
</div>
</div>
當顯示模態,我想設置其寬度,但是失敗了。模態的寬度始終與瀏覽器寬度相同。我試圖用3列(col-xs-3
,col-xs-6
,col-xs-3
)的行來限制模態定義。看起來div add_element_modal
沒有正確定義。但我無法理解。
任何人都可以幫忙嗎?