Html 如何用html删除td边框？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18610469/
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 td border with html?
提问by Bhojendra Rauniyar
html
html
<table border="1">
<tr>
<td>one</td>
<td>two</td>
</tr>
<tr>
<td>one</td>
<td>two</td>
</tr>
</table>
This will output borders like this
这将输出这样的边框
+---+---+
| | |
+---+---+
| | |
+---+---+
But I would like to display the border in table only not to td like this
但我只想在表格中显示边框，而不是像这样 td
+--------+
| |
| |
| |
+--------+
How can I do just with html markup. (NO CSS / NO INLINE STYLES)
我怎么能只用 html 标记。（无 CSS / 无内联样式）
In some cases I need to remove some td borders only and some td border to display something like this:
在某些情况下，我只需要删除一些 td 边框和一些 td 边框以显示如下内容：
+---+---+
| | |
+---+ |
| | |
+---+---+
采纳答案by Jukka K. Korpela
To remove borders between cells, while retaining the border around the table, add the attribute rules=noneto the tabletag.
要移除单元格之间的边框，同时保留表格周围的边框，请将属性添加rules=none到table标记中。
There is no way in HTML to achieve the rendering specified in the last figure of the question. There are various tricky workarounds that are based on using some other markup structure.
HTML 中没有办法实现问题最后一张图中指定的渲染。有各种基于使用其他标记结构的棘手解决方法。
回答by Naveenkumar K
simple solution from my end is to keep another Table with border and insert your table in the outer table.
我的简单解决方案是保留另一个带边框的表并将您的表插入外部表中。
<table border="1">
<tr>
<td>
<table border="0">
<tr>
<td>one</td>
<td>two</td>
</tr>
<tr>
<td>one</td>
<td>two</td>
</tr>
</table>
</td>
</tr>
</table>
回答by AurA
Surround it with a div and give it a border and remove the border from the table
用 div 包围它并给它一个边框并从表格中删除边框
<div style="border: 1px solid black">
<table border="0">
<tr>
<td>one</td>
<td>two</td>
</tr>
<tr>
<td>one</td>
<td>two</td>
</tr>
</table>
</div>
You can check the working fiddle here
As per your updated question .... where you want to add or remove borders. You should remove borders from the html table first and then do the following
根据您更新的问题......您要添加或删除边框的位置。您应该先从 html 表中删除边框，然后执行以下操作
<td style="border-top: 1px solid black">
Assuming like you only want the top border. Similarly you have to do for others. Better way create four css class...
假设你只想要顶部边框。同样，你必须为他人做。更好的方法创建四个 css 类...
.topBorderOnly {
border-top: 1px solid black;
}
.bottomBorderOnly {
border-bottom: 1px solid black;
}
Then add the css to your code depending on the requirements.
然后根据要求将 css 添加到您的代码中。
<td class="topBorderOnly bottomBorderOnly">
This will add both top and bottom border, similarly do for the rest.
这将添加顶部和底部边框，其余部分类似。
回答by Guest
First
第一的
<table border="1">
<tr>
<td style='border:none;'>one</td>
<td style='border:none;'>two</td>
</tr>
<tr>
<td style='border:none;'>one</td>
<td style='border:none;'>two</td>
</tr>
</table>
Second example
第二个例子
<table border="1" cellspacing="0" cellpadding="0">
<tr>
<td style='border-left:none;border-top:none'>one</td>
<td style='border:none;'>two</td>
</tr>
<tr>
<td style='border-left:none;border-bottom:none;border-top:none'>one</td>
<td style='border:none;'>two</td>
</tr>
</table>
回答by beautifulcoder
Try:
尝试：
<table border="1">
<tr>
<td>
<table border="">
...
</table>
</td>
</tr>
</table>
回答by Smuuf
<table border="1" cellspacing="0" cellpadding="0">
<tr>
<td>
<table border="0">
<tr>
<td>one</td>
<td>two</td>
</tr>
<tr>
<td>one</td>
</tr>
</table>
</td>
</tr>
</table>
