Pregunta sobre Arreglando WordPress de Wordpress:

Agregar CSS a TablePress para modificar atributos de texto

Un usuario preguntó 👇

Hola a todos-

Usando TablePress, estoy tratando de configurar una tabla para mostrar un conjunto de entradas de datos que consta de 2 filas cada una.

Quiero hacer lo siguiente: a) Poner el texto en negrita en las capas ODD. b) Agregue un pequeño espacio en la parte inferior de cada fila PAR. c) Cree un intervalo de filas en capas ODD para adaptarse a una entrada más larga.

Si este código se agrega a mi tabla, las filas IMPAR se pueden imprimir:

.tablepress-id-1 .row-1,
.row-3,
.row-5 {
	font-weight: bold;
}

Agregar este código a mi tabla desactiva los límites y afecta el espaciado de TODAS las filas (no solo las filas PAR):

.tablepress-id-1, 
.tablepress-id-1 tr,
.tablepress-id-1 tbody td,
.tablepress-id-1 thead th,
.tablepress-id-1 tfoot th {
	border: none;
	padding-top: 18px;
}

El código enumerado anteriormente se basa en ejemplos del sitio web TablePress.

Entonces, para mis preguntas: 1. ¿Es una mesa el enfoque correcto para lo que quiero hacer? Espero tener hasta 2 o 3 mil entradas en mi mesa.

2. ¿Existe una mejor manera de especificar todas las filas IMPAR que la que estoy haciendo en mi primer ejemplo, especificando cada fila IMPAR individualmente? ¿Existe una palabra reservada que me permita especificar todas las secuencias ODD que tienen solo una línea?

3. ¿Cómo puedo ajustar el relleno o el margen solo en las capas PAR? Intenté ajustar el relleno y los márgenes agregando el código de mi segunda muestra a mi primera muestra, pero no funciona. También intenté especificar números consecutivos en mi segundo ejemplo, usando el mismo formato que se muestra en mi primer ejemplo, pero no funciona.

Supongo que hay una solución simple, pero está más allá de mi comprensión.

El mejor,

Chris

Este tema fue modificado hace 10 meses, 4 semanas por. Razón: movido para configurar WordPress, este no es un tema de desarrollo con WordPress

(@jdembowski)

Moderador del foro y Bruto Squad

Hace 10 meses, 4 semanas

Movido para arreglar WordPress, este no es un tema de desarrollo de WordPress.

Sustituya preguntas específicas sobre plugins en el subforo dedicado a ese plugin.

https://wordpress.org/support/plugin/tablepress/#new-post

(@ alegremente)

Hace 10 meses, 4 semanas

1. Hay tablas específicas para mostrar datos repetidos. ¿Pero realmente necesitas 1000 en una mesa? Hay plugins para agregar un script llamado sorttable, de modo que los datos se puedan ordenar por columna.

2. Sí, hay una forma mejor. Dado :nth-of-type. Mira https://developer.mozilla.org/en-US/docs/Web/CSS/:nth-of-type y esta página te ayuda a probar tu CSS http://lea.verou.me/demos/nth.html

3. A menudo, no se puede hacer mucho con respecto a la altura, el ancho o los márgenes de las tablas. Pero usando acolchado en el td o cualquier etiqueta contenida en el td Eso debería funcionar.

(@tobiasbg)

Hace 10 meses, 4 semanas

Hola,

gracias por tu publicación y perdón por las molestias.

Como Joy ya ha mencionado, usar :nth-of-type posibilidad. También hay TablePress .odd y .even Clases CSS. Con eso, podrías escribir tu código como

.tablepress-id-1 .odd td {
	font-weight: bold;
}

Para obtener más ayuda, sería bueno ver la página con la tabla. ¿Puede publicar un enlace a la página con la tabla donde ocurre este problema, para que pueda mirar directamente? ¡Gracias!

Saludos, Tobias

Lanzador de hilos

(@burrorock)

Hace 10 meses, 3 semanas

Hola, @joyously & @tobiasbg

Gracias por tus respuestas.

La tabla se puede ver aquí: Mesa.

Estoy cerca de alcanzar mi objetivo, las capas ODD son pesadas y estoy listo para los límites, pero todavía hay tres cosas que quiero lograr: 1. Ajustar los márgenes / relleno / espaciado para reducir el espaciado entre aumentos Capas IMPAR / PAR y aumentar el espaciado entre capas PAR / IMPAR.

2. Comprender cómo utilizar las clases CSS .odd y .even.

3. Vuelva a activar los límites (los voy a dejar de lado, justo cuando los elimine límite: ninguno;, Veo solo una línea entre filas en lugar de límites en todas partes).

¡Gracias por tu ayuda!

El mejor,

Chris

Esta respuesta fue modificada hace 10 meses, 3 semanas por. Causa: corregir errores tipográficos

(@tobiasbg)

Hace 10 meses, 3 semanas

Hola Chris,

desafortunadamente, su enlace no me funciona, es solo un error de «compilación».

Mi sugerencia aquí es jugar con esto más en Herramientas de desarrollo para su navegador. Estos le permiten probar el código CSS en vivo en la página.

Saludos, Tobias

Lanzador de hilos

(@burrorock)

Hace 10 meses, 3 semanas

@tobiasbg – ¿Puedes intentarlo de nuevo? ¡Parece que me he olvidado de publicar la página!

(@tobiasbg)

Hace 10 meses, 3 semanas

Hola,

no, todavía no está funcionando. Parece que ha activado un plugin para esto.

Saludos, Tobias

Lanzador de hilos

(@burrorock)

Hace 10 meses, 3 semanas

@tobiasbg – Hola, siento mucho el dolor. ¿Puedes intentarlo de nuevo?

(@tobiasbg)

Hace 10 meses, 3 semanas

Hola,

no, puedo ver la mesa 🙂

Intente reemplazar su «CSS personalizado» actual con:

.tablepress-id-1 tr:nth-child(odd) td {
	font-weight: bold;
	border-top: none;
}

.tablepress-id-1 tr:nth-child(even) td {
	padding-bottom: 50px;
}

¿Es esto lo que estás buscando? Tenga en cuenta que los bordes no funcionarán realmente en todas partes, ya que el espacio en blanco entre las capas PAR / IMPAR también tendría ese límite.

Saludos, Tobias

Lanzador de hilos

(@burrorock)

Hace 10 meses, 3 semanas

Eso funcionó maravillosamente, @tobiasbg

Gracias y @con alegría por compartir su información, ¡lo apreciamos!

TablePress es muy útil y te enviaré algo de dinero para algunas extensiones, tan pronto como entienda exactamente las que necesito.

¡Gracias de nuevo!

El mejor,

Chris

(@tobiasbg)

Hace 10 meses, 3 semanas

Hola,

no hay problema, ¡de nada! 🙂 ¡Es bueno escuchar que esto ayudó! Y gracias por pedir la donación, ¡se lo agradezco mucho!

Todo lo mejor, Tobias

PD: En caso de que no lo tenga, califique TablePress aquí en el directorio de plugins. ¡Gracias!

¿Solucionó tu problema??

0 / 0

Deja una respuesta 0

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *