Table style is an important element in Document360 or for any possible avenue for creating a rich design layout for a document. Document360 has better layout options for tables and table elements.

Why are the table elements important for a document?

Arranging information in a specific arrangement, typically with rows and columns, can help in understanding the complex structures of data.

How to style the tables using CSS Snippets in Document360?

Follow the below steps to change the header font style in Document360 using CSS Snippets.

  1. In the Knowledge base portal, click SettingsKnowledge base siteCustom CSS and JavaScript

  2. You can find the Custom CSS and Custom JavaScript tabs. Click the Custom CSS tab → and click the Add code snippets button right underneath it

  3. A blade window appears, preloaded with seven basic snippets that you can use to customize your knowledge base site. Click the Change table style (the snippet appears on the Custom CSS code block) → Ctrl+S to save it

4_ScreenGIF-Changing_the_Table_Header

Adding custom CSS

You can also add custom CSS styling to your table, apart from the default snippet provided.

For example

table th, table td{
border: 1px solid #67cfbf;
padding: 2px 10px;
}
table th {
background: #fcf8c0;
font-weight: 600;
}
table th:empty {
display:none;
}
tbody tr:nth-child(odd) {
background-color: #f2f2f2;
}

If you input this custom CSS code into it, your output will appear like below:
02_Screenshot_Table_style_CSS