Advertisement
ALENTL

index.html

Nov 22nd, 2023
34
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.20 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6. <title>Nutrition Label</title>
  7. <link rel="stylesheet" href="./css/style.css" />
  8. <link
  9. rel="stylesheet"
  10. href="https://fonts.googleapis.com/css?family=Open+Sans:400,700,800"
  11. />
  12. </head>
  13. <body>
  14. <div class="label">
  15. <header>
  16. <h1 class="bold">Nutrition Facts</h1>
  17. <div class="divider"></div>
  18. <p>8 servings per container</p>
  19. <p class="bold">Serving size <span>2/3 cup (55g)</span></p>
  20. </header>
  21. <div class="divider large"></div>
  22. <div class="calories-info">
  23. <div class="left-container">
  24. <h2 class="bold small-text">Amount per serving</h2>
  25. <p>Calories</p>
  26. </div>
  27. <span>230</span>
  28. </div>
  29. <div class="divider medium"></div>
  30. <div class="daily-value small-text">
  31. <p class="bold right no-divider">% Daily Value *</p>
  32. <div class="divider"></div>
  33. <p><span><span class="bold">Total Fat</span> 8g</span> <span class="bold">10%</span></p>
  34. <p class="indent no-divider">Saturated Fat 1g <span class="bold">5%</span></p>
  35. <div class="divider"></div>
  36. <p class="indent no-divider"><span><i>Trans</i> Fat 0g</span></p>
  37. <div class="divider"></div>
  38. <p><span><span class="bold">Cholesterol</span> 0mg</span> <span class="bold">0%</span></p>
  39. <p><span><span class="bold">Sodium</span> 160mg</span> <span class="bold">7%</span></p>
  40. <p><span><span class="bold">Total Carbohydrate</span> 37g</span> <span class="bold">13%</span></p>
  41. <p class="indent no-divider">Dietary Fiber 4g</p>
  42. <div class="divider"></div>
  43. <p class="indent no-divider">Total Sugars 12g</p>
  44. <div class="divider double-indent"></div>
  45. <p class="double-indent no-divider">Includes 10g Added Sugars <span class="bold">20%</span></p>
  46. <div class="divider"></div>
  47. <p class="no-divider"><span class="bold">Protein</span> 3g</p>
  48. <div class="large divider"></div>
  49. <p>Vitamin D 2mcg <span>10%</span></p>
  50. <p>Calcium 260mg 20%</p>
  51. </div>
  52. </div>
  53. </body>
  54. </html>
  55.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement