удаление границы из ячеек таблицы

<p>я знаю, что это глупый вопрос, но я, кажется, совершенно забыл, как это сделать.</p><p>у меня есть html <code>table</code>, и я хочу удалить все границы вокруг всех ячеек, чтобы вокруг всей таблицы была только одна граница.</p><p>мой код выглядит так:</p><pre><code><table border='1' width='500'> <tr><th><h1>your wheelbarrow</h1></th><tr> <th>product</th> <th>description</th> <th>price</th> <th>quantity</th> <th>total</th> <th>delete</th> </tr> </code></pre>

<p>просто сверните границы таблицы и удалите границы из ячеек таблицы (элементы <code>td</code>).</p><pre><code>table { border: 1px solid #ccc; border-collapse: collapse; } td { border: none; } </code></pre><p>без явной установки <code>border-collapse</code> кросс-браузерное удаление границ ячеек таблицы не гарантируется.</p>

<p>атрибут html для этой цели - <code>rules=none</code> (вставляется в тег <code>table</code>).</p>

<p>просто используйте вашу таблицу внутри div с классом (например, <code>.table1</code>) и не устанавливайте границы для этой таблицы в css. затем используйте код css для этого класса. </p><pre><code>.table1 {border=1px solid black;} </code></pre>

<pre><code><style type="text/css"> table { border:1px solid black; } </style> </code></pre>

<p>возможно, вам просто нужно это правило css:</p><pre><code>table { border-spacing: 0px; } </code></pre><p> <a href="http://jsfiddle.net/bz3jt/3/">http://jsfiddle.net/bz3jt/3/</a> </p>

<p>измените объявление таблицы на:</p><pre><code><table style="border: 1px dashed; width: 500px;"> </code></pre><p>вот пример в действии: <a href="http://jsfiddle.net/kc48k/">http://jsfiddle.net/kc48k/</a> </p>

<p>вы можете попробовать это: <a href="http://jsfiddle.net/qpkvx/">http://jsfiddle.net/qpkvx/</a> </p><p>не совсем уверен, как вы хотите, чтобы ваш окончательный макет выглядел - но это также решает проблему colspan. </p>

<p>если ни одно из решений на этой странице не работает, и у вас возникла следующая проблема:</p><p> <a href="https://i.stack.imgur.com/xx3su.png"> <img src="https://i.stack.imgur.com/xx3su.png" alt="enter image description here"> </a> </p><p>вы можете просто использовать этот фрагмент css:</p><pre><code>td { padding: 0; } </code></pre>