在没有边框的表格中对整行进行着色

本文介绍了在没有边框的表格中对整行进行着色的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述 29岁程序员，3月因学历无情被辞！ 是否可以在HTML表格中对整行进行着色，而不会出现断开或边框缺口？ 到目前为止，我有这张表： p> < table width =500px> < tr bgcolor =pink> < td> Nombre博客< / td> < td> Autora< / td> < td> Idioma< / td> < / tr> < tr> < td>金发沙拉< / td> < td> Chiara Ferragni< / td> < td> Italiano< / td> < / tr> < tr bgcolor =mistyrose> < td> The Pioneer Woman< / td> < td> Ree Drummond< / td> < td>英语< / td> < / tr> < tr> < td> La Tartine Gourmande< / td> < td>BéatricePeltre< / td> < td>Francés< / td> < / tr> < tr bgcolor =mistyrose> < td> Objetivo Cupcake Perfecto< / td> < td> AlmaObregón< / td> < td>Español< / td> < / tr> < / table> 您可以在这个小提琴中看到： http://jsfiddle.net/ncsmzmch/ 正如您所看到的，列之间存在白色差距。如果我放置一个边框甚至是一个折叠的边框，那么这个缝隙显然会消失，导致它被线条（边框）填满。 但是我想留下有颜色的行，但都在一行中，没有空白，也没有边框。 这可以实现吗？谢谢！解决方案当然，请添加 border-collapse 规则： 表格{边界崩溃：崩溃; } jsFiddle示例 < table width =500px> < tr bgcolor =pink> < td> Nombre博客< / td> < TD> Autora< / TD> < TD>语< / TD> < / TR> < TR> < td>金发沙拉< / td> < td> Chiara Ferragni< / td> < TD>意大利语< / TD> < / TR> < tr bgcolor =mistyrose> < td> The Pioneer Woman< / td> < td> Ree Drummond< / td> < TD>英语< / TD> < / TR> < TR> < td> La Tartine Gourmande< / td> < td>BéatricePeltre< / td> < TD>&八方资源LT; / TD> < / TR> < tr bgcolor =mistyrose> < td> Objetivo Cupcake Perfecto< / td> < td> AlmaObregón< / td> < TD>西班牙语< / TD> < / table> is it possible to color entire rows in an html table without being a "break" or gap for the border?So far I have this table: <table width="500px"> <tr bgcolor="pink"> <td>Nombre blog</td> <td>Autora</td> <td>Idioma</td> </tr> <tr> <td>The Blonde Salad</td> <td>Chiara Ferragni</td> <td>Italiano</td> </tr> <tr bgcolor="mistyrose"> <td>The Pioneer Woman</td> <td>Ree Drummond</td> <td>Inglés</td> </tr> <tr> <td>La Tartine Gourmande</td> <td>Béatrice Peltre</td> <td>Francés</td> </tr> <tr bgcolor="mistyrose"> <td>Objetivo Cupcake Perfecto</td> <td>Alma Obregón</td> <td>Español</td> </tr></table>That you can see in this fiddle: http://jsfiddle.net/ncsmzmch/As you can see there is a white gap between columns. If I put a border or even a collapsed border, that gap obviously dissapears, cause it's filled by the line (border).But I want to leave the rows colored, but all in one line, without the gaps, and no borders.Can that be achieved? Thanks! 解决方案 Sure, add a border-collapse rule:table { border-collapse:collapse;}jsFiddle exampletable { border-collapse:collapse;}<table width="500px"> <tr bgcolor="pink"> <td>Nombre blog</td> <td>Autora</td> <td>Idioma</td> </tr> <tr> <td>The Blonde Salad</td> <td>Chiara Ferragni</td> <td>Italiano</td> </tr> <tr bgcolor="mistyrose"> <td>The Pioneer Woman</td> <td>Ree Drummond</td> <td>Inglés</td> </tr> <tr> <td>La Tartine Gourmande</td> <td>Béatrice Peltre</td> <td>Francés</td> </tr> <tr bgcolor="mistyrose"> <td>Objetivo Cupcake Perfecto</td> <td>Alma Obregón</td> <td>Español</td> </tr></table> 这篇关于在没有边框的表格中对整行进行着色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！ 上岸，阿里云！