1

Tengo la siguiente tabla:

<div class="card data-table nueva-table">
            <table>
                <thead>
                    <tr>
                        <th class="nuevo-td" style="font-size: 11px;">Nombre</thd>
                        <th class="nuevo-td" style="font-size: 11px;">Individual</th>
                        <td class="label-cell nuevo-th" style="font-size: 11px;">Red</th>
                        <th class="label-cell nuevo-th" style="font-size: 11px;">Titulo</th>
                    </tr>
                </thead>
                <tbody id="listado_volumen_negocio" class="listado_volumen_negocio">
                </tbody>
            </table>
        </div>

Visualmente es de esta forma:

introducir la descripción de la imagen aquí

Pero en las celdas Individual y red se debe ver de la siguiente forma: introducir la descripción de la imagen aquí

De antemano muy agradecido.

3
  • 1
    no entiendo como deseas que quede asi? si nisiquiera coinciden los nombres?
    – Bryro
    Commented el 26 nov. 2018 a las 19:26
  • Coincido con Bryro, de donde sale el nombre Red Directa por ejemplo Commented el 26 nov. 2018 a las 19:30
  • Seria una nueva celda, en la parte superior. Es cierto, me falto agregar la palabra "Directa" en la imagen anterior.
    – JG_GJ
    Commented el 26 nov. 2018 a las 19:32

3 respuestas 3

2

Lo que deseas saber es como hacer uso de rowspan y colspan de html, te dejo un ejemplo simple:

<table border='1'>
  <tr>
    <td rowspan='2'>
      rowspan 2
    </td>
    <td colspan='2'>
      colspan 2
    </td>
    <td rowspan='2'>
      rowspan 2
    </td>
  </tr>
  <tr>
    <td>celda normal</td>
    <td>celda normal</td>
  </tr>
</table>

Espero que el pequeño ejemplo te sirva.

0

Colspan

<div class="card data-table nueva-table">
<table>
    <thead>
        <tr>
            <th></th>
            <th colspan="2" style="font-size: 11px;">Volumen de Negocio</th>
            <th></th>
        </tr>
        <tr>
            <th class="nuevo-td" style="font-size: 11px;">Nombre</th>
            <th class="nuevo-td" style="font-size: 11px;">Individual</th>
            <td class="label-cell nuevo-th" style="font-size: 11px;">Red</th>
            <th class="label-cell nuevo-th" style="font-size: 11px;">Titulo</th>
        </tr>
    </thead>
    <tbody id="listado_volumen_negocio" class="listado_volumen_negocio">
    </tbody>
</table>

1
  • 2
    Bienvenido a StackOverflow. Tu respuesta fue incluida en la lista de revisión de baja calidad, y esto es debido a que tiene solamente código. Te recomiendo incluir siempre una explicación, aunque sea breve, de cuál es el problema que el OP tiene en su código de la pregunta y/o cómo tu solución resuelve ese problema. Un saludo.
    – jachguate
    Commented el 26 nov. 2018 a las 23:40
0

La propiedad que debes usar en la fila y celda superior es "colspan" e indicar la cantidad de columnas que unirá.

<table border=1>
    <thead>
        <tr>
            <th colspan="2">a</th>
        </tr>
        <tr>
            <th>a</th>
            <th>a</th>
        </tr>
    </thead>
</table>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.