Table Style Examples

To Do: Make the look of these styles more aligned with the overall website look and feel. Aka colors, design elements, rounded corners, font sizes, etc. Also, separate additional attributes such as sortable properly out: e.g. some tables are full-width - the right way would be to add a widetable attribute, etc.

This page contains examples of our table styles

class prettytable

Shopping List
Bread & Butter	Pie	Buns	Danish	Croissant
	Cheese	Ice cream		Butter	Yogurt

class shadedtable

Shopping List
Bread & Butter	Pie	Buns	Danish	Croissant
	Cheese	Ice cream		Butter	Yogurt

class sortable

When a list of entries is included in a table on a page, you can use JavaScript to make the table 'sortable'. To do this, just add the "sortable" class to the table declaration:

Fruit	Price
Apples	£0.95
Oranges	£0.85
Pears	£1.15

You can use this attribute with other table styles.

Fruit	Price
Apples	£0.95
Oranges	£0.85
Pears	£1.15

Fruit	Price
Apples	£0.95
Oranges	£0.85
Pears	£1.15

class wikitable

Shopping List
Bread & Butter	Pie	Buns	Danish	Croissant
	Cheese	Ice cream		Butter	Yogurt

class zebra

Shopping List
Bread & Butter	Pie	Buns	Danish	Croissant
	Cheese	Ice cream		Butter	Yogurt