1. <body>
  2. <div id="noise_1" class="section">
  3. <div class="inner">
  4. <h1>1%</h1>
  5. </div>
  6. </div>
  7. <div id="noise_2" class="section">
  8. <div class="inner">
  9. <h1>2%</h1>
  10. </div>
  11. </div>
  12. <div id="noise_3" class="section">
  13. <div class="inner">
  14. <h1>3%</h1>
  15. </div>
  16. </div>
  17. <div id="noise_4" class="section">
  18. <div class="inner">
  19. <h1>4%</h1>
  20. </div>
  21. </div>
  22. <div id="noise_5" class="section">
  23. <div class="inner">
  24. <h1>5%</h1>
  25. </div>
  26. </div>
  27. </body>
  1. body {
  2. width: 100%;
  3. height: 100%;
  4. margin: 0;
  5. color: #fff;
  6. font-family: "Heiti SC";
  7. }
  8. h1 {
  9. margin: 0;
  10. padding: 1em 0;
  11. }
  12. .section {
  13. float: left;
  14. width: 20%;
  15. }
  16. #noise_1 {
  17. background: #593869 url(../img/noise_1.png) center center;
  18. }
  19. #noise_2 {
  20. background: #593869 url(../img/noise_2.png) center center;
  21. }
  22. #noise_3 {
  23. background: #593869 url(../img/noise_3.png) center center;
  24. }
  25. #noise_4 {
  26. background: #593869 url(../img/noise_4.png) center center;
  27. }
  28. #noise_5 {
  29. background: #593869 url(../img/noise_5.png) center center;
  30. }
  31. .inner {
  32. height: 100vh;
  33. border-right: 1px rgba(255,255,255,.3) dashed;
  34. text-align: center;
  35. }
  36. #noise_5 .inner {
  37. border-right: 0;
  38. }

1%

2%

3%

4%

5%