The background property is a shorthand property for setting all background properties.
div {
width: 70%;
height: 200px;
overflow: scroll;
background: #87ceeb url(image/back.gif) repeat-y scroll right top;
}
| Property | Value | Explanation |
|---|---|---|
| background | each value | sets color, image, repeat, attachment, and position |
background: #87ceeb url(image/back.gif) repeat-y scroll right top;
| background: | #87ceeb | url(image/back.gif) | repeat-y | scroll | right top | ; |
|---|---|---|---|---|---|---|
| background- | color | image | repeat | attachment | position |
The unnecessary values can be omitted.
background: #87ceeb url(image/back.gif) repeat-y;
<html>
<head>
<title>TAG index</title>
<style type="text/css">
div {
width: 70%;
height: 200px;
overflow: auto;
background: #ffffff url(image/back.gif) repeat-y top;
color: red;
}
div p { margin-bottom: 40px; }
</style>
</head>
<body>
<div>
<p>Scroll</p>
...
</div>
</body>
</html>
Scroll
Scroll
Scroll
Scroll
Scroll
Scroll
Scroll
back.gif