Esta es la respuesta más correcta que encomtrarás compartir, sin embargo mírala detenidamente y analiza si se puede adaptar a tu trabajo.
Solución:
Es posible que haya olvidado después de especificar la clase, debe agregar lo siguiente en CSS:
.dt-head-center text-align: center;
Además, si la clase no se ha añadido a la
thead, th text-align: center;
/* OR */
.table thead,
.table th text-align: center;
Para hacerlo específico para una tabla en particular, puede darle a la tabla un id="tableID" y luego en el CSS, puedes hacer:
#tableID thead,
#tableID th text-align: center;
OP, estabas muy cerca de la solución, solo te faltaba el targets opción en columnDefs para asignar el dt-head-center class al encabezado que desea diseñar.
// apply to columns 1 & 2
targets: [ 0, 1 ]
CSS es una opción pero no es necesario.
Me gusta el método sugerido por DataTables para usar el column.className opción para el estilo de las celdas y luego aplicarlas usando targets. https://datatables.net/reference/option/columns.className Esto nos brinda un nivel de control más fino en comparación con una aplicación CSS global.
Esto alineará el contenido del encabezado y el cuerpo individualmente:
columnDefs: [
// Center align the header content of column 1
className: "dt-head-center", targets: [ 0 ] ,
// Center align the body content of columns 2, 3, & 4
className: "dt-body-center", targets: [ 1, 2, 3 ]
]
o alinear ambos al mismo tiempo:
columnDefs: [
// Center align both header and body content of columns 1, 2 & 3
className: "dt-center", targets: [ 0, 1, 2 ]
]
Formato de clase de celda:
dt[-head|-body][-left|-center|-right|-justify|-nowrap]
Más información sobre las clases de celdas de DataTables: https://datatables.net/manual/styling/classes#Cell-classes
Puedes hacer esto con CSS. Simplemente use su clase de tabla como selector y apunte a cada encabezado de tabla dentro de ese selector, así:
.table th
text-align: center;
valoraciones y comentarios
Si eres capaz, puedes dejar un post acerca de qué te ha impresionado de este artículo.