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:
相关标签:
-
2021-01-18 05:46
Sure, add a border-collapse rule:
table {
border-collapse:collapse;
}
jsFiddle example
table {
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>
-
2021-01-18 05:51
use cellspacing
<table width="500px" cellspacing=0>
<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>
see fiddle: fiddle example
-
2021-01-18 06:02
Yeap, you can use one of two ways: either cellspacing or border-collapse:
table {
border-collapse:collapse;
}
..or:
<table cellspacing="0">
Have fun!
-
2021-01-18 06:05
Use border-spacing property and set it to 0 so that the gap is removed.
table {
border-spacing: 0;
}
Demo:
table {
border-spacing: 0
}
<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>