¿Cómo formatear la tabla html con estilos en línea para que parezca una tabla de Excel renderizada?

Actualmente estoy atascado estableciendo fronteras en una tabla html. (I utilizar los estilos en línea para una mejor prestación de e-mail-clientes) tengo este pedazo de código:¿Cómo formatear la tabla html con estilos en línea para que parezca una tabla de Excel renderizada?

<html> 
    <body> 
     <table style="border: 1px solid black;"> 
      <tr> 
       <td width="350" style="border: 1px solid black ;"> 
        Foo 
       </td> 
       <td width="80" style="border: 1px solid black ;"> 
        Foo1 
       </td> 
       <td width="65" style="border: 1px solid black ;"> 
        Foo2 
       </td> 
      </tr> 
      <tr style="border: 1px solid black;"> 
       <td style="border: 1px solid black;"> 
        Bar1 
       </td> 
       <td style="border: 1px solid black;"> 
        Bar2 
       </td> 
       <td style="border: 1px solid black;"> 
        Bar3 
       </td> 
      </tr> 
      <tr style="border: 1px solid black;"> 
       <td style="border: 1px solid black;"> 
        Bar1 
       </td> 
       <td style="border: 1px solid black;"> 
        Bar2 
       </td> 
       <td style="border: 1px solid black;"> 
        Bar3 
       </td> 
      </tr> 
     </table> 
    </body> 
</html>

Se aparece así: alt text

Quiero la tabla que pasarán a ser igual Excel haría una mesa, con borde interno y externo: alt text

Fuente

2010-09-08 citronas

¿Qué navegador está utilizando? en Chrome 6, se ve como lo quieres aquí: http://jsfiddle.net/JceAc/. – Kyle

Estoy usando Firefox 3.6.8 – citronas

table { 
    border-collapse:collapse; 
}

Fuente

2010-09-08 10:01:30

gracias, funciona perfecto;) – citronas

Funciona y se ve como un encanto –

Añadir cellpadding y espaciado de celda para resolverlo. Editar: También se eliminó el borde de doble píxel.

<style> 
td 
{border-left:1px solid black; 
border-top:1px solid black;} 
table 
{border-right:1px solid black; 
border-bottom:1px solid black;} 
</style> 
<html> 
    <body> 
     <table cellpadding="0" cellspacing="0"> 
      <tr> 
       <td width="350" > 
        Foo 
       </td> 
       <td width="80" > 
        Foo1 
       </td> 
       <td width="65" > 
        Foo2 
       </td> 
      </tr> 
      <tr> 
       <td> 
        Bar1 
       </td> 
       <td> 
        Bar2 
       </td> 
       <td> 
        Bar3 
       </td> 
      </tr> 
      <tr > 
       <td> 
        Bar1 
       </td> 
       <td> 
        Bar2 
       </td> 
       <td> 
        Bar3 
       </td> 
      </tr> 
     </table> 
    </body> 
</html>

Fuente

2010-09-08 10:02:27

¿Cómo formatear la tabla html con estilos en línea para que parezca una tabla de Excel renderizada?

Respuesta

Cuestiones relacionadas