HTML and CSS Reference
In-Depth Information
4.
color: #4a4a4d;
5.
font: 14px/1.4 "Helvetica Neue", Helvetica, Arial, sans-serif;
6.
}
7.
th,
8.
td {
9.
padding: 10px 15px;
10.
vertical-align: middle;
11.
}
12.
thead {
13.
background: #395870;
14.
color: #fff;
15.
}
16.
th:first-child {
17.
text-align: left;
18.
}
19.
tbody tr:nth-child(even) {
20.
background: #f0f0f2;
21.
}
22.
td {
23.
border-bottom: 1px solid #c6c7cc;
24.
border-right: 1px solid #c6c7cc;
25.
}
26.
td:first-child {
27.
border-left: 1px solid #c6c7cc;
28.
}
29.
.book-title {
30.
color: #395870;
31.
display: block;
32.
}
33.
.item-stock,
34.
.item-qty {
35.
text-align: center;
36.
}
37.
.item-price {
38.
text-align: right;
39.
}
40.
.item-multiple {
41.
display: block;
42.
}
43.
tfoot {
44.
text-align: right;
45.
}
46.
tfoot tr:last-child {
47.
background: #f0f0f2;
48.
}
Completely Styled Table
So far our table of books is looking pretty good. Let's take it one step further by rounding
some corners and styling some of the text just a little more. (see
Figure 11.11
).
Search WWH ::
Custom Search