​x
 
1
<!DOCTYPE html>
2
<title>Example</title>
3
<style>
4
.animated {
5
  font-family: sans-serif;
6
  font-stretch: ultra-condensed;
7
  animation: myAnimation 3s ease 1s 3 alternate forwards;
8
}
9
​
10
@keyframes myAnimation {
11
  100% {
12
    font-stretch: ultra-expanded;
13
  }
14
}
15
</style>
16
​
17
​
18
<h1 class="animated">CSS animatable property</h1>
19
<p><strong>Note</strong>: If this doesn't work, it could be that you don't have a condensed version of the default font. Also, browser support for this property is very limited at the time of writing.</p>