blocks|key|2029618|text|您需要将此代码添加到CSS中：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2029619|table+{+border-collapse:collapse+}|code-block|syntax|javascript|2029620|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>You need to add this to your CSS:</p>

<pre><code>table { border-collapse:collapse }
</code></pre>


blocks|key|1816615|text|要删除边框，只需像这样使用css：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1816616|td+{
+border-style+:+hidden!important;
}|code-block|syntax|javascript|1816617|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>to remove the border , juste using css like this : </p>

<pre><code>td {
 border-style : hidden!important;
}
</code></pre>


blocks|key|2029568|text|如下所示修改HTML：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2029569|<table+border="0"+cellpadding="0"+cellspacing="0">
++++<thead>
++++++++<tr><td>1</td><td>2</td><td>3</td></tr>
+++++</thead>
++++<tbody>
++++++++<tr><td>a</td><td>b></td><td>c</td></tr>
++++++++<tr+class='odd'><td>x</td><td>y</td><td>z</td></tr>
++++</tbody>
</table>|code-block|syntax|javascript|2029570|(我添加了border="0"+cellpadding="0"+cellspacing="0")|offset|length|style|CODE|2029571|在CSS中，您可以执行以下操作：|2029572|table+{
++++border-collapse:+collapse;
}|2029573|entityMap^0|0|0|5|16|0|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|U|8|@$I|V|J|W|K|L]]|9|@]|A|$]]|$1|M|3|N|5|6|7|X|8|@]|9|@]|A|$]]|$1|O|3|P|5|D|7|Y|8|@]|9|@]|A|$E|F]]|$1|Q|3|-4|5|6|7|Z|8|@]|9|@]|A|$]]]|R|$]]

<p>Modify your HTML like this:</p>

<pre><code>&lt;table border="0" cellpadding="0" cellspacing="0"&gt;
    &lt;thead&gt;
        &lt;tr&gt;&lt;td&gt;1&lt;/td&gt;&lt;td&gt;2&lt;/td&gt;&lt;td&gt;3&lt;/td&gt;&lt;/tr&gt;
     &lt;/thead&gt;
    &lt;tbody&gt;
        &lt;tr&gt;&lt;td&gt;a&lt;/td&gt;&lt;td&gt;b&gt;&lt;/td&gt;&lt;td&gt;c&lt;/td&gt;&lt;/tr&gt;
        &lt;tr class='odd'&gt;&lt;td&gt;x&lt;/td&gt;&lt;td&gt;y&lt;/td&gt;&lt;td&gt;z&lt;/td&gt;&lt;/tr&gt;
    &lt;/tbody&gt;
&lt;/table&gt;
</code></pre>

<p>(I added <code>border="0" cellpadding="0" cellspacing="0"</code>)</p>

<p>In CSS, you could do the following:</p>

<pre><code>table {
    border-collapse: collapse;
}
</code></pre>


blocks|key|2029750|text|添加一些css：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2029751|td,+th+{
+++border:none;
}|code-block|syntax|javascript|2029752|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>add some css:</p>

<pre><code>td, th {
   border:none;
}
</code></pre>


blocks|key|2029727|text|将表的cellspacing属性设置为0。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|2029728|您也可以使用CSS样式border-spacing:+0，但前提是您不需要支持较旧版本的IE。|2029729|entityMap^0|3|B|J|1|0|B|H|0^^$0|@$1|2|3|4|5|6|7|J|8|@$9|K|A|L|B|C]|$9|M|A|N|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|O|8|@$9|P|A|Q|B|C]]|D|@]|E|$]]|$1|H|3|-4|5|6|7|R|8|@]|D|@]|E|$]]]|I|$]]

<p>Set the <code>cellspacing</code> attribute of the table to <code>0</code>.</p>

<p>You can also use the CSS style, <code>border-spacing: 0</code>, but only if you don't need to support older versions of IE.</p>


blocks|key|1816404|text|您可能还想添加|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1816405|table+td+{+border:0;+}|code-block|syntax|javascript|1816406|以上相当于将cellpadding=设置为“0”|1816407|它摆脱了浏览器自动添加到单元格的填充，这些填充可能依赖于doctype和/或用于重置默认浏览器样式的任何CSS|1816408|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|6|7|P|8|@]|9|@]|A|$]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

<p>You may also want to add</p>

<pre><code>table td { border:0; }
</code></pre>

<p>the above is equivalent to setting cellpadding="0"</p>

<p>it gets rid of the padding automatically added to cells by browsers which may depend on doctype and/or any CSS used to reset default browser styles</p>


blocks|key|2029933|text|在尝试了上述建议之后，唯一对我起作用的是在子主题的style.css的以下部分中将边框属性更改为"0“(执行”查找“操作来定位每个边框--以下只是一些代码片段)：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2029934|.comment-content+table+{
++++border-bottom:+1px+solid+#ddd;

.comment-content+td+{
++++border-top:+1px+solid+#ddd;
++++padding:+6px+10px+6px+0;
}|code-block|syntax|javascript|2029935|这样之后看起来就像这样：|2029936|.comment-content+table+{
++++border-bottom:+0;

.comment-content+td+{
++++border-top:+0;
++++padding:+6px+10px+6px+0;
}|2029937|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

<p>After trying the above suggestions, the only thing that worked for me was changing the border attribute to "0" in the following sections of a child theme's style.css (do a "Find" operation to locate each one -- the following are just snippets):</p>

<pre><code>.comment-content table {
    border-bottom: 1px solid #ddd;

.comment-content td {
    border-top: 1px solid #ddd;
    padding: 6px 10px 6px 0;
}
</code></pre>

<p>Thus looking like this afterwards:</p>

<pre><code>.comment-content table {
    border-bottom: 0;

.comment-content td {
    border-top: 0;
    padding: 6px 10px 6px 0;
}
</code></pre>


blocks|key|1816257|text|尝试将border:+0px;+border-collapse:+collapse;样式指定给表元素。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1816258|entityMap^0|3|13|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|K|8|@]|D|@]|E|$]]]|G|$]]

<p>Try assigning the style of <code>border: 0px; border-collapse: collapse;</code> to the table element.</p>


blocks|key|2029987|text|有时甚至在清除border之后也是如此。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|2029988|原因是你在td中有图像，给图像display:block就可以解决它。|2029989|entityMap^0|7|6|0|5|2|F|D|0^^$0|@$1|2|3|4|5|6|7|J|8|@$9|K|A|L|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|M|8|@$9|N|A|O|B|C]|$9|P|A|Q|B|C]]|D|@]|E|$]]|$1|H|3|-4|5|6|7|R|8|@]|D|@]|E|$]]]|I|$]]

<p>sometimes even after clearing <code>border</code>s.</p>

<p>the reason is that you have images inside the <code>td</code>, giving the images <code>display:block</code> solves it.</p>


<p>I have a peculiar and frustrating problem. For the simple markup:</p>

<pre class="lang-html prettyprint-override"><code>&lt;table&gt;
    &lt;thead&gt;
        &lt;tr&gt;&lt;th&gt;1&lt;/th&gt;&lt;th&gt;2&lt;/th&gt;&lt;th&gt;3&lt;/th&gt;&lt;/tr&gt;
     &lt;/thead&gt;
    &lt;tbody&gt;
        &lt;tr&gt;&lt;td&gt;a&lt;/td&gt;&lt;td&gt;b&gt;&lt;/td&gt;&lt;td&gt;c&lt;/td&gt;&lt;/tr&gt;
        &lt;tr class='odd'&gt;&lt;td&gt;x&lt;/td&gt;&lt;td&gt;y&lt;/td&gt;&lt;td&gt;z&lt;/td&gt;&lt;/tr&gt;
    &lt;/tbody&gt;
&lt;/table&gt;
</code></pre>

<p>I apply different background-color values to the <em>thead</em>, <em>tr</em>, and <em>tr</em> odd elements. The problem is that in most browsers, every cell has an unwanted border which is not the color of any of the table rows. Only in Firefox 3.5 does the table have no borders in any cell. </p>

<p>I'd just like to know how to remove these borders in the other major browsers so that the only thing you see in the table are the alternating row colors.</p>


Removing unwanted table cell borders with CSS

我有一个奇怪而令人沮丧的问题。对于简单的标记：<table>    <thead>        <tr><th>1</th><th>2</th><th>3</th></tr>     </thead>    <tbody>        <tr><td>a</td><td>b></td><td>c</td></tr>        <tr class='odd'><td>x</td><td>y<

问使用CSS删除不需要的表格单元格边框
EN

回答 9

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用CSS删除不需要的表格单元格边框EN

回答 9

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用CSS删除不需要的表格单元格边框
EN