Html 如何去除表格边框线?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/19331164/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
how to remove table border line?
提问by Arsal Ali
I am creating a table. I want to remove table border line, how do I this?
我正在创建一个表。我想删除表格边框线,我该怎么做?
Here is my code:
这是我的代码:
<div id="table">
<table class="table table-bordered">
<thead>
<tr>
<th style="text-align:left; width:120px;">Item</th>
<th style="text-align:left; width:200px;">Description</th>
<th style="width:100px;">Unit Cost</th>
<th style="text-align:right; width:60px;">Qty</th>
<th style="text-align:left; width:100px;">Tax</th>
<th style="text-align:left; width:100px;">Tax</th>
<th style="text-align:left; width:100px;">Line Total</th>
</tr>
</thead>
<tbody>
<tr>
<td colspan=7 width=800>
<div id="dataRows">
<div class="fieldRow" id="template">
<select class="items" name="items" style="width:127px; float:left;" id="items"> <option value="1" selected="selected" disabled="disabled"></option></select>
<textarea name="description" id="description" class="description" style="float:left; display: block; height: 30px; width:211px; border-radius:0px; margin: -1px 0px 0;"></textarea>
<input type="text" name="unitprice" id="unitprice" class="unitprice" style="float:left; display: block; height: 30px; width:106px; border-radius:0px; margin: -1px 0px 0;">
<input type="text" name="quantity" id="quantity" class="quantity" style="float:left; display: block; height: 30px; width:64px; border-radius:0px; margin: -1px 0px 0;">
<select name="firsttax" id="firsttax" class="firsttax" style=" float:left; display: block; height: 31px; width:107px; border-radius:0px; margin: -2px 0px 0;"><option value="1" selected="selected" ></option></select>
<select name="secondtax" id="secondtax" class="secondtax" style="float:left; display: block; height: 31px; width:104px; border-radius:0px; margin: -2px 0px 0;"><option value="1" selected="selected"></option></select>
<input type="text" name="linetotal" id="linetotal" class="linetotal" placeholder="0.00" readonly style="float:left; display: block; height: 31px; width:104px; border-radius:0px; background-color: #F0F0F0; text-align:right; margin: -2px 0px 0;">
<input type="button" class="button remove" id="btnDel" value="Remove Row" style="float:right; margin:0 -110px; color: #ffffff; background-color: #d9534f; border-color: #d43f3a; padding: 3px 10px; margin-bottom: 0; font-size: 14px; font-weight: normal; line-height: 1.428571429; text-align: center; white-space: nowrap; vertical-align: middle; cursor: pointer; border:1px solid transparent; border-radius: 4px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none;" />
</div>
</div>
</td>
</tr>
<input type="hidden" id="itemscounter" name="itemscounter" value=""/>
<tr>
<td colspan=7 rowspan=2 width=800 style="border:0px solid white;">
<div style="border:1px solid #DDDDDD; width:317px; height:50px; margin:0 -1px; float:right;">
<label class="required" id="invoicetotal" for="Invoicetotal" style="padding-top:3px;">Invoice Total(USD)</label>
<span style=" font-weight:bold; margin:4px -204px 0; float:right;">$</span>
<input type="text" class="required" id="invoicetotalamount" name="invoicetotalamount" placeholder="0.00" readonly style=" color:#526273; font-weight:bold; text-align:left; border: 0px solid #000000;"/><br>
<label class="required" id="paidtodate" for="paidtodate" style="margin-top: -6px;">Paid to date</label>
<input type="text" class="required" id="paidtodateamount" name="paidtodateamount" placeholder="0.00" style=" color:#526273; font-weight:bold; text-align:right; border: 0px solid #000000;"/>
</div>
<div class="clear"></div>
<div style="border:1px solid #DDDDDD; width:317px; height:33px; margin:50px -316px 0; float:right;">
<label class="required" id="balance" for="balance" style="margin-top:0px;">Balance(USD)</label>
<span style=" font-weight:bold; margin:7px 45px 0; float:left;">$</span>
<input type="text" class="required" id="balanceamount" name="balanceamount" placeholder="0.00" readonly style=" color:#526273; font-weight:bold; text-align:left; border: 0px solid #000000;"/>
</div>
</td>
</tr>
</tbody>
</table>
</div>
and here is my css:
这是我的css:
#table{
float: left;
height: 200px;
margin: -291px 19px 0;
width: 825px;
}
and here is screenshot:
这是截图:
回答by Dvid Silva
use css
使用 CSS
it would be
这将是
table, th, td
{
border: 0;
}
table
{
border-collapse:collapse;
}
回答by Karuppiah RK
<table border="0" style="width:825px;"> </table>
put border value 0 in css or declare table border like these above i mentioned.. post ur full css code..
将边框值 0 放入 css 或像上面提到的那样声明表格边框.. 发布你的完整 css 代码..
回答by Parth Gadam
Try to use this code:
尝试使用此代码:
<table border="0" style="width:825px;border:0px;"> </table>
回答by Iren Patel
Try this simple CSS
试试这个简单的 CSS
table.myTable { border:none; }
回答by Malav Shah
edit your class and add/change border to zero or try changing into border tag in table.
编辑您的课程并将边框添加/更改为零或尝试更改为表格中的边框标记。