陰影是一種常見的CSS技術，可以在網頁中創建出具有層次感和逼真感的頁面效果。本文將介紹如何使用CSS陰影技術來創建一個陰影背景效果圖。
以下是一個簡單的陰影背景效果圖示例：
```html
<!DOCTYPE html>
<html>
<head>
<title>陰影背景效果圖</title>
<style>
body {
background-color: #f2f2f2;
background-size: cover;
background-position: center;
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
.box {
background-color: #fff;
width: 200px;
height: 200px;
box-shadow: 0px 0px 10px #ccc;
margin: 20px auto;
display: flex;
justify-content: center;
align-items: center;
</style>
</head>
<body>
<div class="box"></div>
</body>
</html>
在這個示例中，我們使用了一個簡單的容器元素來創建陰影效果。我們在父元素上設置了一個背景顏色、一個寬度和一個高度，并將陰影屬性設置為“box-shadow”，并在其中添加了一個黑色漸變。我們還為子元素添加了一個居中對齊的邊框，并使用Flexbox布局來使其具有對稱性。
通過在CSS中設置陰影屬性，我們可以創建出各種不同規模和形狀的的陰影效果。陰影還可以通過顏色、透明度和半徑等參數進行調整。
在實際應用中，我們可以根據實際需要創建出更多的陰影效果，以豐富網頁的外觀和視覺效果。陰影技術還可以應用于其他CSS技術和組件中，以創建出更多的復雜頁面效果。