Table Styles

/** * @author mithun */

table{
margin: auto;
border-collapse:collapse;
font-family:Lucida Grande, Verdana;
font-size:16px;
text-align: center;
width:80%;
}
table td,table th{
padding:2px;
font-weight:normal;
padding: 2px;
}
table th{
font-weight:bold;
}
table.aquamarine{
border: 1px solid #050;
}
table.aquamarine tr th,
table.aquamarine tr td{
border: 1px dotted #050;
}
table.aquamarine tr th{
background-color: #48a474;
color: #ccffcc;
}
table.aquamarine tr td{
background-color: #ded;
}
table.aquamarine tr.alt td{
background-color: #b8dcc1;
}
table.aquamarine tr:hover td{
background-color: #7fc08f;
color: #ccffcc;
}
table.blue{
border: 1px solid #94beff;
}
table.blue tr th,
table.blue tr td{
border: 1px dotted #94beff;
}
table.blue td, table th {
background-color: #94beff;
background-image:url(../images/bg-head.gif);
background-repeat:no-repeat;
background-position:top right;
}
table.blue td.selectedUp,
table th.selectedUp {
background-image:url(../images/bg-headup.gif);
}
table.blue td.selectedDown,
table th.selectedDown {
background-image:url(../images/bg-headdown.gif);
}
table.blue tr td{
background: #fff;
}
table.blue tr.alt td{
background: #e3edfa;
}
table.blue tr.selected td{
background: yellow;
}
table.blue tr:hover td{
background: #a6c2e7;
}
table.blue tr.selected:hover td{
background:#ff9;}table.cool{
border: 1px solid #6BB12B;
}
table.cool tr th,
table.cool tr td{
border: 1px dotted #91d552;
}
table.cool tr th{
background-color: #91d552;
color: #000;
}
table.cool tr td{
background-color: #d5f7b5;
}
table.cool tr.alt td{
background-color: #e7fad5;
}
table.cool tr:hover td{
background-color: #b1f075;
color: #333;
}
table.cyan{
border: 1px solid #2b8383;
}
table.cyan tr th,
table.cyan tr td{
border: 1px dotted #2b8383;
}
table.cyan tr th{
background-color: #099;
color: #cfc;
}
table.cyan tr td{
background-color: #e5f5f5;
}
table.cyan tr.alt td{
background-color: #d1f0f0;
}
table.cyan tr:hover td{
background-color: #a5e1e0;
color: #366;
}table.green{
border: 1px solid #00B366;
}
table.green tr th,
table.green tr td{
border: 1px dotted #00B366;
}
table.green tr th{
background-color: #167a61;
color: #cfc;
}
table.green tr td{
background-color: #569591;
}
table.green tr.alt td{
background-color: #63a8a8;
}
table.green tr:hover td{
background-color: #167a61;
color: #cfc;
}
table.nature{
border: 1px solid #4b6c15;
color: #040;
}
table.nature tr th,
table.nature tr td{
border: 1px dotted #4b6c15;
}
table.nature tr th{
background-color: #4b6c15;
color: #fff;
}
table.nature tr td{
background-color: #d9e8af;
}
table.nature tr.alt td{
background-color: #bcd671;
}
table.nature tr:hover td{
background: #73a800;
}
table.orange{
color: #400;
border: 1px solid #f93;
}
table.orange tr th,
table.orange tr td{
border: 1px dotted #f93;
}
table.orange tr th{
background-color: #fc0;
}
table.orange tr td{
background-color: #feb;
}
table.orange tr.alt td{
background-color: #fe9;
}
table.orange tr.selected td{
background-color: #fc9;
}
table.orange tr:hover td{
background: #fd8;
}
table.orange tr.selected:hover td{
background:#fcb;
}
table.olive{
border: 1px solid #090;
color: #040;
}
table.olive tr th,
table.olive tr td{
border: 1px dotted #090;
}
table.olive tr th{
background-color: #4B6C15;
color: #fff;
}
table.olive tr td{
background-color: #dfd;
}
table.olive tr.alt td{
background-color: #dfe;
}
table.olive tr.selected td{
background-color: #9dc;
}
table.olive tr:hover td{
background: #bfb;
}
table.olive tr.selected:hover td{
background:#9ca;
}
table.pink{
border: 1px solid #faa;
color: #400;
}
table.pink tr th,
table.pink tr td{
border: 1px dotted #faa;
}
table.pink tr th{
background-color: #f99;
}
table.pink tr td{
background-color: #fee;
}
table.pink tr.alt td{
background-color: #fdd;
}
table.pink tr.selected td{
background-color: #fcd;
}
table.pink tr:hover td{
background: #fbb;
}
table.pink tr.selected:hover td{
background:#ebc;
}
table.pink tr th.selectedUp{
background-color: #f99;
}
table.pink tr th.selectedDown{
background-color: #f99;
}
table.violet{
border: 1px solid #81218a;
}
table.violet tr th,
table.violet tr td{
border: 1px dotted #81218a;
}
table.violet tr th{
background-color: #81218a;
color: #fff;
}
table.violet tr td{
background-color: #f7f8f9;
}
table.violet tr.alt td{
background-color: #e8f1f7;
}
table.violet tr:hover td{
background-color: #c4cae2;
color: #333;
}

source

Leave a Reply