​x
 
1
<!DOCTYPE html>
2
<title>Example</title>
3
<style>
4
.animated {
5
  font: 100 1em/1.5em sans-serif;
6
  background-color: black;
7
  color: white;
8
  width: 330px;
9
  padding: 5px;
10
  text-align: center;
11
  opacity: 0.0;
12
  animation: myAnimation 2s ease 1s 3 alternate forwards;
13
}
14
​
15
@keyframes myAnimation {
16
  100% {
17
    opacity: 1.0;
18
  }
19
}
20
</style>
21
​
22
<div class="animated">
23
 <h1>New Zealand</h1>
24
 <img src="/pix/samples/2m.jpg" alt="Scenery in New Zealand">
25
</div>