HTML and CSS Reference
In-Depth Information
backgrounds are applied to the
<section> element:
section {
margin: 1em;
padding: 5%;
outline: 4px dashed black;
background:
url('trans-66.png')
50% 50% no-repeat,
url('10years.jpg') no-repeat;
background-size: 90% 90%,
100%;
display: inline-block;
}
Adding multiple background images
is a matter of listing them in the back-
ground property, along with any rele-
vant attributes, separated by
commas:
background: top right
url('pitr-head.png') no-repeat,
bottom right
url('aj-head.png') no-repeat,
top left
url('mike-head.png') no-repeat,
bottom left
url('sid-head.png') no-repeat;
See the full example in ch10/back-
grounds-5.html.
All the other background properties also allow a comma-separated list,
so you could write the previous example as follows:
background-image: url('pitr-head.png'), url('pitr-head.png'),
url('mike-head.png'), url('sid-head.png');
background-position: top right, bottom right,
top left, bottom left;
background-repeat: no-repeat, no-repeat,
no-repeat, no-repeat;
 
Search WWH ::




Custom Search