CSS 實(shí)用實(shí)例(推薦)

2020-10-23 18:54:32

字體：大中小

來(lái)源：轉(zhuǎn)載

供稿：網(wǎng)友

Background 背景設(shè)置背景顏色

[Ctrl+A 全選注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]

設(shè)置一張圖片做為背景

[Ctrl+A 全選注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]

垂直重復(fù)背景圖片

[Ctrl+A 全選注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]

水平重復(fù)背景圖片

[Ctrl+A 全選注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]

怎樣放置背景圖片（位置擺放）

[Ctrl+A 全選注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]

背景不滾動(dòng)

<html> <head> <style type="text/css"> body { background-image: url('http://www.blueidea.com/articleimg/2006/07/3744/smiley.gif'); background-repeat: no-repeat; background-attachment: fixed } </style> </head> <body> The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page </body> </html>

[Ctrl+A 全選注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]

背景屬性一行解決（用一行文字定義背景屬性）

[Ctrl+A 全選注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]

上一篇：給圖片加陰影效果的CSS

下一篇：css靜態(tài)濾鏡