Nio 的個人網站

[ CSS ] DIV 有背景圖 又需要滾動時

====== DIV 有背景圖 又需要滾動時 ========
當 DIV 中需要設定背景圖，而 DIV 內容過長需要捲動時，對於背景圖可以做以下設定：


pre {
    max-height: 150px;
    border: 1px solid silver;
    overflow: auto;
    background: url('http://placekitten.com/200/200');
    color: white;
    text-shadow: 0 -.1em .1em black;
}

.scroll { background-attachment: scroll; } /*Body 滾動 ＆ DIV 滾動時背景都固定*/

.fixed { background-attachment: fixed; }   /*Body 滾動時圖片滾動、 DIV 滾動時圖片不動(有點像視差滾動)*/

.local { background-attachment: local; }   /*Body 滾動時圖片不動、DIV 滾動時圖片滾動*/

body { padding: 10% }


範例：http://lea.verou.me/2012/04/background-attachment-local/