經(jīng)歸對(duì)css的學(xué)習(xí)之后，通過(guò)對(duì)之前使用純HTML實(shí)現(xiàn)考試頁(yè)面進(jìn)行添加樣式，進(jìn)行美化試卷達(dá)到一下效果：

?

1.將每一個(gè)部分通過(guò)class命名，然后再head中進(jìn)行樣式的設(shè)置

<section class="head">
<tr class="info">
<tr class="top">……

2.使用margin使每一塊進(jìn)行居中設(shè)置

      margin-left: auto;
        margin-right: auto;  //使每一個(gè)塊居中
        margin-bottom: 20px;
        padding-bottom: 10px;// 讓相鄰之間的塊能夠有一定的距離

?

3.使用table標(biāo)簽設(shè)置試卷的基本信息，使基本信息對(duì)齊,對(duì)table及tr進(jìn)行樣式的設(shè)置，使其更加美觀

table {
width: 900px;
border-collapse: collapse;//添加邊框
}

    tr {
        text-indent: 30px;//設(shè)置文本縮進(jìn)
        margin-top: 10px;
    }

?

4.在每道題使用table進(jìn)行樣式的設(shè)置，對(duì)題目題號(hào)進(jìn)行特殊樣式設(shè)置

.top {
height: 40px;//設(shè)置高度
background-color: darkgray;//設(shè)置背景顏色
text-indent: 2px;//設(shè)置文本縮進(jìn)
}