Shadow in Html5 with Css3

Here in this code, I use CSS code with Html. In HTML I only write text (hello friends) and take a box.
By Css I defined the initial size of the box is 200px and the color of the box is green. In-text I use H1(heading 1).
By Css I choose the background color of the body is light yellow (#CF9) and align of text is center.
for a rounded box I use box-radius.
for box-shadow I use "text-shadow: h-shadow v-shadow blur spread the color."
for text-shadow I use "text-shadow: h-shadow v-shadow blur color".
CODE
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html
  3. xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6. <style>
  7. body
  8. {
  9. background-color: #CF9;
  10. }
  11. h1
  12. {
  13. text-align: center;
  14. font-family: Algerian;
  15. font-size: 100px;
  16. color: #90F;
  17. text-shadow: 10px 10px 8px #666;
  18. }
  19. .box
  20. {
  21. width: 200px;
  22. height: 200px;
  23. border-radius: 40px;
  24. background-color: #0C6;
  25. margin-left: 40%;
  26. margin-top: 10%;
  27. box-shadow: 5px 10px 15px 5px #666666;
  28. }
  29. </style>
  30. <title>Untitled Document</title>
  31. </head>
  32. <body>
  33. <h1>
  34. HELLO FRIENDS</h1>
  35. <div class="box"></div>
  36. </body>
  37. </html>