CSS背景指定大小是指將頁面上一個元素的背景大小限制為一個特定的大小,無論該元素的實際大小是多少。
要指定CSS背景大小,請使用“background-size”屬性。此屬性接受多個值,其中最常用的是百分比和長度。
.example { background-image: url('background.jpg'); background-size: 80%; }
這個例子中,我們將一個帶有背景圖片的div元素的背景大小設置為容器寬度的80%。這意味著無論div元素的實際寬度是多少,背景始終會以它的80%大小呈現。
您也可以使用像像素(px)或em這樣的長度單位來指定背景大小。
.example { background-image: url('background.jpg'); background-size: 500px 300px; }
這個例子中,我們將div元素的背景大小指定為500像素寬,300像素高。
您還可以將背景大小設置為“cover”,這將拉伸或壓縮背景圖像以覆蓋整個背景區域。
.example { background-image: url('background.jpg'); background-size: cover; }
最后,您可以將背景大小設置為“contain”,這將拉伸或壓縮背景圖像以適合背景區域而不改變其縱橫比。
.example { background-image: url('background.jpg'); background-size: contain; }
通過將背景大小指定為特定的值,您可以更好地控制網站中元素的布局和外觀。
上一篇css背景樣式圖解