index.html 7.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <link rel="stylesheet" href="style.css">
  5. <meta charset="UTF-8">
  6. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  7. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8. <title>Document</title>
  9. </head>
  10. <body>
  11. <section id="cover">
  12. <header>
  13. <div class="container header">
  14. <img src="FitoNyashki/images/logo 1.svg" alt="">
  15. <nav>
  16. <ul class="nav_menu">
  17. <li class="nav_item"><a href="">О нас</a></li>
  18. <li class="nav_item"><a href="">Блок</a></li>
  19. <li class="nav_item"><a href="">Каталог</a></li>
  20. <li class="nav_item"><a href="">Контакты</a></li>
  21. </ul>
  22. </nav>
  23. </div>
  24. </header>
  25. <div class="container cover">
  26. <div>
  27. <h1>
  28. Джунгли у вас дома
  29. </h1>
  30. <p>
  31. У нас растения, за которыми легко ухаживать
  32. </p>
  33. <button>
  34. Выбрать растение
  35. </button>
  36. </div>
  37. </div>
  38. </section>
  39. <section>
  40. <div class="container us">
  41. <img src="FitoNyashki/images/about.png" alt="О нас">
  42. <div class="content">
  43. <h2>
  44. О нас
  45. </h2>
  46. <p>
  47. Наша команда
  48. </p>
  49. </div>
  50. </div>
  51. </section>
  52. <section id="cotolog">
  53. <div class="container">
  54. <div class="cotolog_d">
  55. <h2>
  56. Каталог
  57. </h2>
  58. </div>
  59. <div class="cards">
  60. <div class="card">
  61. <img src="images/chris-lee-70l1tDAI6rM-unsplash 1.png" alt="">
  62. <div class="card_d">
  63. <p>
  64. Растение 1
  65. </p>
  66. <p>
  67. 1000₽
  68. </p>
  69. </div>
  70. <button>
  71. Заказать
  72. </button>
  73. </div>
  74. <div class="card">
  75. <img src="FitoNyashki/images/chris-lee-70l1tDAI6rM-unsplash 1.png" alt="">
  76. <div class="card_d">
  77. <p>
  78. Растение 2
  79. </p>
  80. <p>
  81. 1000₽
  82. </p>
  83. </div>
  84. <button>
  85. Заказать
  86. </button>
  87. </div>
  88. <div class="card">
  89. <img src="FitoNyashki/images/chris-lee-70l1tDAI6rM-unsplash 1.png" alt="">
  90. <div class="card_d">
  91. <p>
  92. Растение 3
  93. </p>
  94. <p>
  95. 1000₽
  96. </p>
  97. </div>
  98. <button>
  99. Заказать
  100. </button>
  101. </div>
  102. <div class="card">
  103. <img src="FitoNyashki/images/chris-lee-70l1tDAI6rM-unsplash 1.png" alt="">
  104. <div class="card_d">
  105. <p>
  106. Растеня 4
  107. </p>
  108. <p>
  109. 1000₽
  110. </p>
  111. </div>
  112. <button>
  113. Заказать
  114. </button>
  115. </div>
  116. <div class="card">
  117. <img src="FitoNyashki/images/chris-lee-70l1tDAI6rM-unsplash 1.png" alt="">
  118. <div class="card_d">
  119. <p>
  120. Растение 5
  121. </p>
  122. <p>
  123. 1000₽
  124. </p>
  125. </div>
  126. <button>
  127. Заказать
  128. </button>
  129. </div>
  130. <div class="card">
  131. <img src="FitoNyashki/images/chris-lee-70l1tDAI6rM-unsplash 1.png" alt="">
  132. <div class="card_d">
  133. <p>
  134. Растение 6
  135. </p>
  136. <p>
  137. 1000₽
  138. </p>
  139. </div>
  140. <button>
  141. Заказать
  142. </button>
  143. </div>
  144. </div>
  145. </section>
  146. <section id="guide">
  147. <div class="container">
  148. <div class="guide_content">
  149. <div class="guide_form">
  150. <h2>
  151. Получите гайд по любому растению бесплатно
  152. </h2>
  153. <form action="">
  154. <input type="text" placeholder="Имя">
  155. <input type="text" placeholder="Номер">
  156. </form>
  157. <button>Получить</button>
  158. </div>
  159. </div>
  160. </div>
  161. </section>
  162. <section id="block blockom">
  163. <div class="container">
  164. <div class="block_d">
  165. <h2>
  166. Блок
  167. </h2>
  168. <p>
  169. Узнайте
  170. </p>
  171. </div>
  172. <div class="blocks">
  173. <div class="block">
  174. <img src="FitoNyashki/images/news_card.png" alt="">
  175. <div class="block_d">
  176. <p>
  177. Как выбрать растение
  178. </p>
  179. </div>
  180. </div>
  181. <div class="block">
  182. <img src="FitoNyashki/images/news_card.png" alt="">
  183. <div class="block_d">
  184. <p>
  185. Как выбрать растение
  186. </p>
  187. </div>
  188. </div>
  189. <div class="block">
  190. <img src="FitoNyashki/images/news_card.png" alt="">
  191. <div class="block_d">
  192. <p>
  193. Как выбрать растение
  194. </p>
  195. </div>
  196. </div>
  197. <div class="block">
  198. <img src="FitoNyashki/images/news_card.png" alt="">
  199. <div class="block_d">
  200. <p>
  201. Как выбрать растение
  202. </p>
  203. </div>
  204. </div>
  205. </div>
  206. </div>
  207. </section>
  208. <section id="svaz">
  209. <div class="svaz1">
  210. <div class="svaz_txt">
  211. <h2>
  212. Оставайтесь с нами на связи
  213. </h2>
  214. <p>
  215. +79999999999
  216. </p>
  217. <p>
  218. Телеграм
  219. </p>
  220. <p>
  221. ВКонтакте
  222. </p>
  223. </div>
  224. </div>
  225. </section>
  226. <footer>
  227. <img src="FitoNyashki/images/logo 1.svg" alt="" style="width: 50px;">
  228. <p>
  229. Home plants
  230. </p>
  231. <p>
  232. 2024
  233. </p>
  234. </footer>
  235. </body>
  236. </html>