|
Ключевые слова
scroll | изображение перемещается вместе с перемещением страницы |
fixed | изображение не перемещается вместе при перемещении страницы |
В следующем примере создаётся бесконечная полоса, которая будет перемещаеться вместе с прокруткой рабочей области окна браузера (вьюпорта).
1. | BODY { |
2. | background: red url("pendant.gif"); |
3. | background-repeat: repeat-y; |
4. | background-attachment: fixed; |
5. | } |
6. | |
7. |
Дополнительный пример:
1. | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> |
2. | <HTML> |
3. | <HEAD> |
4. | <TITLE>Свойство background-attachment</TITLE> |
5. | <STYLE type="text/css"> |
6. | BODY { |
7. | background: #faf9e2 url("img.jpg"); |
8. | background-repeat: repeat-y; |
9. | background-attachment: fixed; |
10. | margin-left:120px; |
11. | } |
12. | </STYLE> |
13. | </HEAD> |
14. | <BODY> |
15. | <div class="page"> |
16. | <p>Не будет другом женщины тот, кто может быть ее любовником. |
17. | Опоре де Бальзак. |
18. | <p>Природа наделила женщину огромной властью, |
19. | и нет поэтому ничего удивительного, |
20. | что законы эту власть ограничивают. |
21. | Самюэль Джонсон |
22. | </div> |
23. | </BODY> |
24. | </HTML> |