在網(wǎng)頁(yè)設(shè)計(jì)中,背景是一個(gè)十分重要的元素,如果能合理地運(yùn)用背景css代碼,不僅能夠美化頁(yè)面,還能夠提高頁(yè)面的可讀性和用戶體驗(yàn)。下面介紹幾個(gè)背景css代碼的編寫(xiě)方法:
/* 1. 單色背景 */ body { background-color: #F5F5DC; } /* 2. 漸變色背景 */ body { background: linear-gradient(to bottom, #32CD32, #FF6347); } /* 3. 圖片背景 */ body { background-image: url("example.jpg"); /* 設(shè)置圖片不平鋪 */ background-repeat: no-repeat; /* 圖片定位 */ background-position: center; } /* 4. 背景大小 */ body { background-size: cover; } /* 5. 背景透明度 */ body { background-color: rgba(255, 255, 255, 0.5); } /* 6. 背景固定 */ body { background-attachment: fixed; }
以上是幾種常用的背景css代碼,它們可以單獨(dú)使用,也可以同時(shí)混合使用,比如可以將背景設(shè)置為漸變色的同時(shí)加上圖片和透明度效果,以此增加頁(yè)面的美觀程度。當(dāng)然,在使用這些代碼時(shí),要合理地把握背景色、背景圖、背景大小、透明度、固定與滾動(dòng)等因素的關(guān)系,以達(dá)到最佳的視覺(jué)效果。
下一篇css 文本框居中