我正在嘗試將輸入標簽使用到表格中,而輸入標簽沒有任何邊框
<table class="table table-bordered">
<thead>
<tr class="bg-info">
<th>first name</th>
<th>last name</th>
<th>college</th>
<th>department</th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="text" class="form-control"></td>
<td><input type="text" class="form-control"></td>
<td><input type="text" class="form-control"></td>
<td><input type="text" class="form-control"></td>
</tr>
</tbody>
</table>
我想洗掉這個
空行,并使輸入標簽成為列的全尺寸?有可能嗎,嘗試實作這樣的東西
引導程式 4
謝謝你 ..
uj5u.com熱心網友回復:
只需洗掉每個單元格的默認填充和表單控制元件的默認邊框
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA 058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<style>
/* remove the padding of cell */
table.table tr td {
padding:0;
}
/* remove the border of input */
input.form-control, input.form-control:focus {
border:0;
box-shadow:none;
}
</style>
</head>
<table class="table table-bordered">
<thead>
<tr class="bg-info">
<th>first name</th>
<th>last name</th>
<th>college</th>
<th>department</th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="text" class="form-control"></td>
<td><input type="text" class="form-control"></td>
<td><input type="text" class="form-control"></td>
<td><input type="text" class="form-control"></td>
</tr>
</tbody>
</table>
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/366118.html
標籤:javascript html bootstrap-4
