CSS黑白塊背景可以為網站帶來簡單大方的設計風格,讓網頁看起來更加清新,干凈。如下代碼可以實現一個簡單的黑白塊背景:
body { background: #fff; } .block { width: 200px; height: 200px; background: #000; } .block:nth-of-type(odd) { background: #fff; }
首先,整個網頁的背景設置為白色。接著,我們通過設置一個類名為block的塊元素來實現黑白相間的背景。塊元素的寬高都為200px,背景設置為黑色。通過使用nth-of-type偽類選擇器,將奇數行的背景設置成白色。這樣下來,就能夠實現一個整齊、簡潔的黑白塊背景。通過微調塊元素的寬度、高度以及設置預設的顏色,這個黑白塊背景可以非常方便地用在不同的網頁設計中。