datatables.net-plugins/features/orderNumbers/examples/custom-css.xml

Various small plug-ins for DataTables including feature, ordering, search and internationalisation plug-ins.

<?xml version="1.0" encoding="UTF-8" ?>
<dt-example table-type="html" order="2">

<css lib="datatables feature-orderNumbers">

table {
	--dt-order-numbers-light-background: #db5c00;
	--dt-order-numbers-dark-background: #9dbf23;
}

</css>
<js lib="jquery datatables feature-orderNumbers">
<![CDATA[
$('#example').DataTable({
	order: [
		{idx: 0, dir: 'asc'},
		{idx: 1, dir: 'asc'}
	],
	orderNumbers: true
});
]]>
</js>
<js-vanilla>
<![CDATA[
new DataTable('#example', {
	order: [
		{idx: 0, dir: 'asc'},
		{idx: 1, dir: 'asc'}
	],
	orderNumbers: true
});
]]>
</js-vanilla>

<title lib="OrderNumbers">Custom CSS</title>

<info><![CDATA[

This example shows that the styling for the ordering indicators can be easily modified to suit your needs through CSS variables.

]]></info>

</dt-example>