¿Cómo se especifica el relleno de tabla en CSS?

Beatriz Enríquez
¿Cómo se especifica el relleno de tabla en CSS?
La tabla es un elemento importante de HTML que se utiliza para organizar y administrar los datos en forma de filas y columnas. Sigue un flujo similar a un gráfico y puede almacenar imágenes, estadísticas y datos personales. Además, los usuarios pueden diseñar el ""Elemento aplicando varias propiedades CSS. Por ejemplo, establecer el relleno dentro de las celdas de la tabla y muchos más.

Esta publicación demostrará:

  • Cómo hacer una mesa en html?
  • Cómo especificar un relleno de tabla en CSS?

Cómo hacer una mesa en html?

Para crear/hacer una tabla en HTML, pruebe el procedimiento establecido.

Paso 1: Crear contenedor "Div"
Primero, crea un "div"Contenedor con la ayuda del""Etiqueta y asignarle un atributo de clase con un nombre en particular.

Paso 2: hacer mesa
A continuación, utilice el "

"Elemento junto con el"contenido"Clase para crear una mesa dentro del Div.

Paso 3: Agregar filas de tabla
Ahora, inserte el siguiente elemento entre el "

"Etiqueta para hacer celdas de tabla e incrustar datos:

  • "
"La etiqueta se usa para especificar las filas en la tabla.
  • Después de eso, agregue el "
    • "Etiquetas para definir una celda de encabezado.
  • "
    • "Etiqueta entre el primero"
    "Se usa para agregar las celdas de datos en la tabla:










    Nombre Cuidadoso
    Hafsi Reino Unido
    Eduardo India
    Bella EE.UU
    Conejito Pakistán
    Jacobo África
    Casar Bangladesh
    Llamativo Singapur
    Jenny Irán

    Se puede observar que la tabla se ha creado con éxito:

    Cómo especificar un relleno de tabla en CSS?

    Para especificar el acolchado o el espaciado de la tabla, puede usar varias propiedades CSS, que incluyen "espacio fronterizo","espaciado celular", y "chapotería". Estos son métodos válidos para producir el espacio.

    Para especificar un relleno de tabla en CSS, siga las instrucciones dadas.

    Paso 1: Elemento de estilo "div"
    Primero, acceda al "div"Container con la ayuda del atributo de clase asignado".principal". Luego, aplique las propiedades de CSS declaradas:

    .principal-div
    margen: 20px 150px;
    Color de fondo: Bisque;
    borde: 4px de azul punteado;

    Aquí:

    • "margen"Se utiliza para especificar el espacio en blanco fuera del límite del elemento.
    • "color de fondo"Se usa para establecer el color de fondo del elemento.
    • "borde"Define un límite alrededor del elemento.

    Producción

    Paso 2: Establezca el relleno de la tabla
    Para configurar el relleno de la tabla, acceda al "mesa.contenido" clase. Después de eso, aplique las propiedades CSS codificadas a continuación:

    mesa.contenido
    borde: 5px RGB sólido (228, 15, 15);
    espaciado fronterizo: 12px;
    margen: 50px 150px;
    Color de fondo: RGB (247, 209, 139);

    Aquí el "espacio fronterizoSe utiliza la propiedad para establecer la distancia o el espacio entre las bordes y las celdas adyacentes en la tabla.

    Como puede ver, se ha agregado el relleno de la mesa:

    Paso 3: celdas de datos de tabla de estilo
    Para aplicar CSS en un elemento específico de la tabla, primero, acceda a él con la clase de tabla como "mesa.contenido"Y el nombre de la etiqueta del elemento como"TD":

    mesa.contenido td
    borde: RGB sólido (233, 36, 10) 1px;

    Según el fragmento de código dado, hemos aplicado el "bordePropiedad en celdas de datos:

    Eso se trataba de especificar el relleno de tabla en CSS.

    Conclusión

    Para especificar el relleno de la tabla, primero, cree una tabla con la ayuda del "

    " etiqueta. Luego, acceda a la tabla en CSS usando el nombre de la etiqueta y la clase asignada. Después de eso, aplique el "espacio fronterizo"Propiedad en la tabla para ajustar el espacio entre los bordes de las celdas adyacentes. Esta publicación ha explicado el procedimiento para especificar el relleno de la tabla en CSS.

    c agudo
    ¿Cuáles son las variables constantes en C#?
    Una variable constante es un tipo de variable cuyo valor se establece durante su definición y no se ...
    Lorenzo Canales
    c agudo
    Cómo usar la palabra clave de lanzar en c#
    La palabra clave de lanzamiento es como una declaración de salto en C# que puede plantear una excepc...
    Hernán Delao
    php
    Cómo usar la función Array_Merge en PHP?
    La función array_merge () en PHP le permite combinar múltiples matrices en una. Siga este artículo p...
    Mariana Cotto