|
|
@ -12,28 +12,31 @@ |
|
|
margin: 0; |
|
|
margin: 0; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.red { |
|
|
|
|
|
background-image: url(img/flood.jpg); |
|
|
|
|
|
|
|
|
.paralax { |
|
|
background-size: cover; |
|
|
background-size: cover; |
|
|
background-attachment: fixed; |
|
|
background-attachment: fixed; |
|
|
background-color: indianred; |
|
|
|
|
|
height: 100vh; |
|
|
height: 100vh; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.red { |
|
|
|
|
|
background-image: url(img/flood.jpg); |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
.blue { |
|
|
.blue { |
|
|
background-color: cornflowerblue; |
|
|
background-color: cornflowerblue; |
|
|
height: 100vh; |
|
|
height: 100vh; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.green { |
|
|
|
|
|
background-image: url(img/fire.jpg); |
|
|
|
|
|
} |
|
|
</style> |
|
|
</style> |
|
|
</head> |
|
|
</head> |
|
|
<body> |
|
|
<body> |
|
|
<div class="red">A</div> |
|
|
|
|
|
<div class="blue">B</div> |
|
|
|
|
|
<div class="red">A</div> |
|
|
|
|
|
<div class="blue">B</div> |
|
|
|
|
|
<div class="red">A</div> |
|
|
|
|
|
<div class="blue">B</div> |
|
|
|
|
|
<div class="red">A</div> |
|
|
|
|
|
|
|
|
<div class="red paralax">A</div> |
|
|
<div class="blue">B</div> |
|
|
<div class="blue">B</div> |
|
|
|
|
|
<div class="green paralax">C</div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</body> |
|
|
</body> |
|
|
</html> |
|
|
</html> |
