Table Style Examples: Difference between revisions
From Xen
Jump to navigationJump to search
Lars.kurth (talk | contribs) |
Lars.kurth (talk | contribs) |
||
| Line 195: | Line 195: | ||
</pre> |
</pre> |
||
Note that in order for the {{Sortable}} icon to be shown, you need to add |
|||
<pre> |
|||
{| class="prettytable sortable" |
|||
|- |
|||
! Fruit {{Sortable}} !! Price {{Sortable}} |
|||
</pre> |
|||
'''Example:''' |
'''Example:''' |
||
| Line 200: | Line 207: | ||
{| class="prettytable sortable" |
{| class="prettytable sortable" |
||
|- |
|- |
||
! Fruit !! Price |
! Fruit {{Sortable}} !! Price {{Sortable}} |
||
|- |
|- |
||
| Pears || £1.15 |
| Pears || £1.15 |
||
Revision as of 13:13, 8 August 2016
This page contains examples of our table styles
Base Styles
class prettytable
| Shopping List | |||||
|---|---|---|---|---|---|
| Bread & Butter | Pie | Buns | Danish | Croissant | |
| Cheese | Ice cream | Butter | Yogurt | ||
| Fruit | Price |
|---|---|
| Pears | £1.15 |
| Apples | £0.95 |
| Oranges | £0.85 |
class shadedtable
| Shopping List | |||||
|---|---|---|---|---|---|
| Bread & Butter | Pie | Buns | Danish | Croissant | |
| Cheese | Ice cream | Butter | Yogurt | ||
| Fruit | Price |
|---|---|
| Pears | £1.15 |
| Apples | £0.95 |
| Oranges | £0.85 |
class shadedtable2
| Shopping List | |||||
|---|---|---|---|---|---|
| Bread & Butter | Pie | Buns | Danish | Croissant | |
| Cheese | Ice cream | Butter | Yogurt | ||
| Fruit | Price |
|---|---|
| Pears | £1.15 |
| Apples | £0.95 |
| Oranges | £0.85 |
class wikitable
| Shopping List | |||||
|---|---|---|---|---|---|
| Bread & Butter | Pie | Buns | Danish | Croissant | |
| Cheese | Ice cream | Butter | Yogurt | ||
| Fruit | Price |
|---|---|
| Pears | £1.15 |
| Apples | £0.95 |
| Oranges | £0.85 |
class zebra
| Shopping List | |||||
|---|---|---|---|---|---|
| Bread & Butter | Pie | Buns | Danish | Croissant | |
| Cheese | Ice cream | Butter | Yogurt | ||
| Fruit | Price |
|---|---|
| Pears | £1.15 |
| Apples | £0.95 |
| Oranges | £0.85 |
Modifiers
These are table classes that modify an existing table classes behavior.
class fullwidth
Make a table the size of the page.
{| class="zebra fullwidth"
...
Example:
| Fruit | Price |
|---|---|
| Apples | £0.95 |
class sortable
Make a table sortable.
{| class="prettytable sortable"
...
Note that in order for the
icon to be shown, you need to add
{| class="prettytable sortable"
|-
! Fruit {{Sortable}} !! Price {{Sortable}}
Example:
| Fruit |
Price |
|---|---|
| Pears | £1.15 |
| Apples | £0.95 |
| Oranges | £0.85 |
