Shulou(Shulou.com)06/03 Report--

This article will explain in detail how the two refreshing table styles are often used, and the content of the article is of high quality, so the editor will share it for you to do a reference. I hope you will have a certain understanding of the relevant knowledge after reading this article.

Attached are two table styles that I often use:

The code is as follows:

Body,table {

Font-size:12px

}

Table {

Table-layout:fixed

Empty-cells:show

Border-collapse: collapse

Margin:0 auto

}

Td {

Height:30px

}

H2,h3,h4 {

Font-size:12px

Margin:0

Padding:0

}

.table {

Border:1px solid # cad9ea

Color:#666

}

.table th {

Background-repeat:repeat-x

Height:30px

}

.table td,.table th {

Border:1px solid # cad9ea

Padding:0 1em 0

}

.table tr.alter {

Background-color:#f5fafe

}

School number

Name

Usually

Mid-term

Experiment (practice)

Other

End of term

General comment

one

one

one

one

one

one

one

one

two

two

two

two

two

two

two

two

The code is as follows:

.table

{

Width: 100%

Padding: 0

Margin: 0

}

Th {

Font: bold 12px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif

Color: # 4f6b72

Border-right: 1px solid # C1DAD7

Border-bottom: 1px solid # C1DAD7

Border-top: 1px solid # C1DAD7

Letter-spacing: 2px

Text-transform: uppercase

Text-align: left

Padding: 6px 6px 6px 12px

Background: # CAE8EA no-repeat

}

Td {

Border-right: 1px solid # C1DAD7

Border-bottom: 1px solid # C1DAD7

Background: # fff

Font-size:14px

Padding: 6px 6px 6px 12px

Color: # 4f6b72

}

Td.alt {

Background: # F5FAFA

Color: # 797268

}

Th.spec,td.spec {

Border-left: 1px solid # C1DAD7

}

/ *-for IE 5.x bug*/

Html > body td {font-size:14px;}

Tr.select th,tr.select td

{

Background-color:#CAE8EA

Color: # 797268

}

Choice

Course name

Course number

Number of exams already taken

one

one

one

one

two

two

two

two

three

three

three

three

On the frequently used two refreshing table style is shared here, I hope that the above content can be of some help to you, can learn more knowledge. If you think the article is good, you can share it for more people to see.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.