I’m not good in Graphics so I mostly use the default HTML Table with border=1 which does look pretty awkward…

So I decided to create a little CSS to make the default Table look a bit nicer.

Here’s the CSS:

table {
	font: normal 11px verdana, arial, helvetica, sans-serif;
	border-collapse: collapse;
	border: 1px solid black;
	background: #EAEAEA;
	empty-cells: show;
}

th {
	border: 1px solid black;
	text-align: left;
	background: #4591AD;
	color: #FFFFFF;
}

td, th {
	border: 1px solid black;
	padding: .4em;
}

tr:hover {
	background: #CCDDEE;
}

td:hover {
	background: yellow;
}

And here’s a sample HTML how it looks like:
CSS Table Example

Note: The hover Effect may not work on all Browsers (especially not in all Internet Explorers…)