Below are the examples of the default table styling.
Simple table
First Header |
Second Header |
Content from cell 1 |
Content from cell 2 |
Content in the first column |
Content in the second column |
Markdown
Custom styles
It is also possible to change a bit table styles by applying CSS classes. By default there are two classes available:
.wide
- makes table width 100%
First Header |
Second Header |
Content from cell 1 |
Content from cell 2 |
Content in the first column |
Content in the second column |
Markdown - note the last line
.inner-borders
- shows inner borders
First Header |
Second Header |
Content from cell 1 |
Content from cell 2 |
Content in the first column |
Content in the second column |
Markdown - note the last line
You can add more such classes by putting them inside theme.scss. Here is how the above mentioned classes are defined:
Few more examples from kramdown documentation:
Default aligned |
Left aligned |
Center aligned |
Right aligned |
First body part |
Second cell |
Third cell |
fourth cell |
Second line |
foo |
strong |
baz |
Third line |
quux |
baz |
bar |
Second body |
|
|
|
2 line |
|
|
|
Footer row |
|
|
|
Table header row, two table bodies and a table footer row
Default aligned |
Left aligned |
Center aligned |
Right aligned |
First body part |
Second cell |
Third cell |
fourth cell |
Second line |
foo |
strong |
baz |
Third line |
quux |
baz |
bar |
Second body |
|
|
|
2 line |
|
|
|
Footer row |
|
|
|
Same as above but shorter