CSS分頁(yè)樣式是指在頁(yè)面內(nèi)容過(guò)多,需要進(jìn)行分頁(yè)展示時(shí),通過(guò)CSS技術(shù)設(shè)計(jì)的一種樣式,使得分頁(yè)展示更加美觀、易讀。
/* 分頁(yè)樣式 */ .pagination{ margin: 20px 0; text-align: center; } .pagination a{ display: inline-block; margin: 0 10px; padding: 5px 10px; text-decoration: none; color: #333; border: 1px solid #999; border-radius: 5px; } .pagination .active{ background-color: #333; color: #fff; } .pagination a:hover{ background-color: #333; color: #fff; }
在這段CSS樣式中,首先我們針對(duì)分頁(yè)外層進(jìn)行了樣式設(shè)置,添加了20px的頂部和底部邊距,并將文字居中展示。接著針對(duì)每個(gè)分頁(yè)鏈接進(jìn)行樣式設(shè)置,使其以塊級(jí)元素展示,并設(shè)置了10px的左右外邊距和5px的上下內(nèi)邊距,同時(shí)設(shè)置了文字顏色、邊框、圓角等屬性。我們還為當(dāng)前激活的分頁(yè)鏈接添加了特殊樣式。最后,設(shè)置了鼠標(biāo)移動(dòng)到分頁(yè)鏈接上時(shí)的懸停效果。