font-stretch all values

  
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Example</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style rel="stylesheet" type="text/css">
body {
  font-family: arial;
  font-size: 12pt;
}

p.normal {
  font-stretch: normal;
}

p.wider {
  font-stretch: wider;
}

p.narrower {
  font-stretch: narrower;
}

p.ultra-condensed {
  font-stretch: ultra-condensed;
}

p.extra-condensed {
  font-stretch: extra-condensed;
}

p.condensed {
  font-stretch: condensed;
}

p.semi-condensed {
  font-stretch: semi-condensed;
}

p.semi-expanded {
  font-stretch: semi-expanded;
}

p.expanded {
  font-stretch: expanded;
}

p.extra-expanded {
  font-stretch: extra-expanded;
}

p.ultra-expanded {
  font-stretch: ultra-expanded;
}
</style>
</head>

<body>
<p class="normal">normal.</p>
<p class="wider">wider.</p>

<p class="narrower">narrower.</p>

<p class="ultra-condensed">ultra-condensed.</p>

<p class="extra-condensed">extra-condensed.</p>

<p class="condensed">condensed.</p>

<p class="semi-condensed">semi-condensed.</p>

<p class="semi-expanded">semi-expanded.</p>

<p class="expanded">expanded.</p>
<p class="extra-expanded">extra-expanded.</p>
<p class="ultra-expanded">ultra-expanded.</p>
</body>
</html>
font-stretch all values : font stretch « CSS « HTML / CSS

Related examples in the same category
