HTML Element Style How to - Sink first letter

Question

We would like to know how to sink first letter.

Answer


<!DOCTYPE html>
<html>
<head>
<style type='text/css'>
div.on p {<!--   w w  w . jav  a  2s. c  om-->
  font: normal 13px/19px 'Verdana';
}

div.on p:first-child:first-letter {
  float: left;
  font-size: 72px;
  line-height: 72px;
  margin: 0 6px 0 0;
}
</style>
</head>
<body>
  <div class="on">
    <p>This is a test This is a test This is a test This is a test
      This is a test This is a test This is a test This is a test</p>
    This is a test
    <p>This is a test This is a test This is a test This is a test
      This is a test This is a test</p>
  </div>
</body>
</html>

The code above is rendered as follows: