CSS

CSS#

You can use CSS to alter how tables are rendered.

For instance, we change the font size for all the tables in the document with this code:

from IPython.display import HTML, display

css = """
.dt-container {
  font-size: small;
}
"""
display(HTML(f"<style>{css}</style>" ""))

This is helpful for instance in the context of Quarto presentations.

With this over CSS, we change every datatable table header in the notebook to bold/italic.

css = """
.dataTable th {
    font-weight: bolder;
    font-style: italic;
}
"""
display(HTML(f"<style>{css}</style>" ""))

You might also want to alter the style of specific tables only. To do this, add a new class to the target tables, as in the example below:

class_specific_css = ".table_with_monospace_font { font-family: courier, monospace }"
display(HTML(f"<style>{class_specific_css}</style>" ""))
import itables

itables.init_notebook_mode()

df = itables.sample_dfs.get_countries(html=False)

itables.show(df, classes="display nowrap table_with_monospace_font")
Loading ITables v2.4.0rc1 from the init_notebook_mode cell... (need help?)