Advertisement
Ammarsami

locksmithpalmdaleca

Apr 30th, 2016
75
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 22.49 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang="en">
  3.  
  4. <head>
  5. <meta charset="UTF-8">
  6. <title>Zazor</title>
  7.  
  8. </head>
  9.  
  10. <body>
  11. <div class="wrapper">
  12.  
  13. <header class="clearfix">
  14. <div class="telephone">
  15. <ul>
  16. <li>
  17. <div class="circle">
  18. <img src="img/telephone.png" alt="telephone" />
  19. </div>
  20. </li>
  21. <li>(044)123-45-67</li>
  22. <li>(044)567-89-10</li>
  23. </ul>
  24. </div>
  25. <div class="avtoriz">
  26. <ul>
  27. <li>
  28. <img src="img/avtoriz.png" alt="human" />
  29. </li>
  30. <li>
  31. <form class="" action="#" method="post">
  32. <input type="text" name="login" placeholder="логин">
  33. <input type="password" name="password" placeholder="пароль">
  34. </form>
  35. </li>
  36. <li>
  37. <a href="#">вход</a>
  38. </li>
  39. <li>
  40. <a href="#">регистрация</a>
  41. </li>
  42. <li>
  43. <a href="#">забыли пароль?</a>
  44. </li>
  45. </ul>
  46. </div>
  47. <nav>
  48. <ul>
  49. <li>
  50. <a href="#">
  51. <img src="img/home.png" alt="home" />
  52. </a>
  53. </li>
  54. <li>
  55. <a href="#">
  56. <img src="img/map.png" alt="map" />
  57. </a>
  58. </li>
  59. <li>
  60. <a href="#">
  61. <img src="img/letter.png" alt="letter" />
  62. </a>
  63. </li>
  64. </ul>
  65. </nav>
  66. </header>
  67. <section class="clearfix">
  68. <img src="img/main_pic.png" alt="main picture" />
  69. <menu class="clearfix">
  70. <ul class="menu">
  71. <li>
  72. <a href="#"></a>
  73. </li>
  74. <li>
  75. <a href="#"></a>
  76. </li>
  77. <li>
  78. <a href="#"></a>
  79. </li>
  80. <li>
  81. <a href="#"></a>
  82. </li>
  83. <li>
  84. <a href="#"></a>
  85. </li>
  86. </ul>
  87. <ul class="korzina">
  88. <li>
  89. <img src="img/korzina.png" alt="korzina" />
  90. </li>
  91. <li>товаров:</li>
  92. <li>0</li>
  93. <li>на сумму:</li>
  94. <li>0,00 грн.</li>
  95. </ul>
  96. </menu>
  97. <div class="select">
  98. <aside class="find_auto">
  99. <div class="labels">
  100. <h3>Диски:</h3>
  101. <h1>Поиск по автомобилю</h1>
  102. <h3>Шины:</h3>
  103. </div>
  104. <div class="disk">
  105. <form class="po_avto" action="#" method="post">
  106. <div class="marka">
  107. <label for="marka">Марка
  108. <span>авто:</span>
  109. </label>
  110. <select class="marka" name="">
  111. <option value="marka"></option>
  112. </select>
  113. </div>
  114. <div class="model">
  115. <label for="model">Модель
  116. <span>автомобиля:</span>
  117. </label>
  118. <select class="model" name="">
  119. <option value="model"></option>
  120. </select>
  121. </div>
  122. <div class="year">
  123. <label for="year">Год выпуска
  124. <span>автомобиля:</span>
  125. </label>
  126. <select class="year" name="">
  127. <option value="year"></option>
  128. </select>
  129. </div>
  130. <div class="komplekt">
  131. <label for="komplekt">Комплектация:</label>
  132. <select class="komplekt" name="">
  133. <option value="komplekt"></option>
  134. </select>
  135. </div>
  136. </form>
  137. </div>
  138. <div class="shiny">
  139. <form class="po_avto" action="#" method="post">
  140. <div class="marka">
  141. <label for="marka">Марка
  142. <span>авто:</span>
  143. </label>
  144. <select class="marka" name="">
  145. <option value="marka"></option>
  146. </select>
  147. </div>
  148. <div class="model">
  149. <label for="model">Модель
  150. <span>автомобиля:</span>
  151. </label>
  152. <select class="model" name="">
  153. <option value="model"></option>
  154. </select>
  155. </div>
  156. <div class="year">
  157. <label for="year">Год выпуска
  158. <span>автомобиля:</span>
  159. </label>
  160. <select class="year" name="">
  161. <option value="year"></option>
  162. </select>
  163. </div>
  164. <div class="komplekt">
  165. <label for="komplekt">Комплектация:</label>
  166. <select class="komplekt" name="">
  167. <option value="komplekt"></option>
  168. </select>
  169. </div>
  170. </form>
  171. </div>
  172. <a href="#" class="select__link">поиск...</a>
  173. </aside>
  174. <aside class="find_tires">
  175. <h1>поиск шин</h1>
  176. <form class="poisk_shin" action="index.html" method="post">
  177. <div class="size">
  178. <label for="size">Размер:</label>
  179. <select class="size" name="">
  180. <option value="size">145</option>
  181. </select>
  182. <span>/</span>
  183. <select class="size" name="">
  184. <option value="size"></option>
  185. </select>
  186. </div>
  187. <div class="radius">
  188. <label for="radius">R</label>
  189. <select class="radius" name="">
  190. <option value="radius">12</option>
  191. </select>
  192. </div>
  193. <div class="sezon">
  194. <label for="sezon">Сезон:</label>
  195. <div class="sezon_type">
  196. <div class="leto">
  197. <input type="checkbox" name="" id="sezon">
  198. <label for="leto">лето</label>
  199. </div>
  200. <div class="zima">
  201. <input type="checkbox" name="" id="sezon">
  202. <label for="zima">зима</label>
  203. </div>
  204. <div class="vsesez">
  205. <input type="checkbox" name="" id="sezon">
  206. <label for="vsesez">всесез</label>
  207. </div>
  208. </div>
  209. </div>
  210. </form>
  211. <a href="#" class="select__link">поиск...</a>
  212. </aside>
  213. <aside class="find_disk">
  214. <div class="left">
  215. <h1>поиск дисков</h1>
  216. <form class="disk_poisk" action="index.html" method="post">
  217. <div class="diametr_d">
  218. <label for="diametr_d">Диаметр
  219. <span>диска:</span>
  220. </label>
  221. <select class="diametr_d" name="">
  222. <option value="diametr_d">14</option>
  223. </select>
  224. </div>
  225. <div class="kol_ot">
  226. <label for="kol_ot">Количество
  227. <span>крепёжных отверстий: </span>
  228. </label>
  229. <select class="kol_ot" name="">
  230. <option value="kol_ot">3</option>
  231. </select>
  232. </div>
  233. <div class="diam_krep">
  234. <label for="diam_krep">Диаметр
  235. <span>расположения крепёжных отверстий: </span>
  236. </label>
  237. <select class="diam_krep" name="">
  238. <option value="diam_krep">12</option>
  239. </select>
  240. </div>
  241. </form>
  242. </div>
  243. <div class="right">
  244. <form class="dop_opt" action="index.html" method="post">
  245. <div class="dzo">
  246. <label for="dzo">ДЦО
  247. <span>(диаметр центрального отверстия):</span>
  248. </label>
  249. <select class="dzo" name="">
  250. <option value="dzo">12</option>
  251. </select>
  252. </div>
  253. <div class="et">
  254. <label for="et">ET
  255. <span>(вылет диска):</span>
  256. </label>
  257. <select class="et" name="">
  258. <option value="et">12</option>
  259. </select>
  260. </div>
  261. </form>
  262. </div>
  263. <a href="#" class="select__link">поиск...</a>
  264. </aside>
  265. </div>
  266. </section>
  267.  
  268. <main class="clearfix">
  269. <div class="catalog">
  270. <figcaption class="main_capt1">
  271. <img src="img/copy.png" alt="copy sign" />
  272. <span>каталог продукции:</span>
  273. </figcaption>
  274. <figcaption class="next_capt">
  275. <img src="img/mark.png" alt="mark sign" />
  276. <span>шины</span>
  277. </figcaption>
  278. <ul>
  279. <li>
  280. <a href="#">Наименование 1</a>
  281. </li>
  282. <li>
  283. <a href="#">Наименование 2</a>
  284. </li>
  285. <li>
  286. <a href="#">Наименование 3</a>
  287. </li>
  288. <li>
  289. <a href="#">Наименование 4</a>
  290. </li>
  291. </ul>
  292. <figcaption class="next_capt">
  293. <img src="img/mark.png" alt="mark sign" />
  294. <span>диски</span>
  295. </figcaption>
  296. <ul>
  297. <li>
  298. <a href="#">Наименование 1</a>
  299. </li>
  300. <li>
  301. <a href="#">Наименование 2</a>
  302. </li>
  303. <li>
  304. <a href="#">Наименование 3</a>
  305. </li>
  306. <li>
  307. <a href="#">Наименование 4</a>
  308. </li>
  309. </ul>
  310. <figcaption class="next_capt">
  311. <img src="img/mark.png" alt="mark sign" />
  312. <span>болты</span>
  313. </figcaption>
  314. <ul>
  315. <li>
  316. <a href="#">Наименование 1</a>
  317. </li>
  318. <li>
  319. <a href="#">Наименование 2</a>
  320. </li>
  321. <li>
  322. <a href="#">Наименование 3</a>
  323. </li>
  324. <li>
  325. <a href="#">Наименование 4</a>
  326. </li>
  327. </ul>
  328. </div>
  329.  
  330. <article class="tovary clearfix">
  331. <div class="line">
  332. <a href="#" class="tovar">
  333. <h4>Goodyear</h4>
  334. <p>Ultra Grip Extreme</p>
  335. <figure>
  336. <img src="img/pic1.png" alt="pic1">
  337. </figure>
  338. <p>90.00 грн</p>
  339. </a>
  340. <a href="#" class="tovar">
  341. <h4>Nokian</h4>
  342. <p>Hakkapeliitta R</p>
  343. <figure>
  344. <img src="img/pic2.png" alt="pic2">
  345. </figure>
  346. <p>115.00 грн</p>
  347. </a>
  348. <a href="#" class="tovar">
  349. <h4>Hankook</h4>
  350. <p class="move">K 708 155/65 R14</p>
  351. <figure>
  352. <img src="img/pic3.png" alt="pic3">
  353. </figure>
  354. <p>393.00 грн</p>
  355. </a>
  356. </div>
  357. <div class="line">
  358. <a href="#" class="tovar">
  359. <h4>Goodyear</h4>
  360. <p>Ultra Grip Extreme</p>
  361. <figure>
  362. <img src="img/pic1.png" alt="pic1">
  363. </figure>
  364. <p>90.00 грн</p>
  365. </a>
  366. <a href="#" class="tovar">
  367. <h4>Nokian</h4>
  368. <p>Hakkapeliitta R</p>
  369. <figure>
  370. <img src="img/pic2.png" alt="pic2">
  371. </figure>
  372. <p>115.00 грн</p>
  373. </a>
  374. <a href="#" class="tovar">
  375. <h4>Hankook</h4>
  376. <p class="move">K 708 155/65 R14</p>
  377. <figure>
  378. <img src="img/pic3.png" alt="pic3">
  379. </figure>
  380. <p>393.00 грн</p>
  381. </a>
  382. </div>
  383. <div class="line">
  384. <a href="#" class="tovar">
  385. <h4>Goodyear</h4>
  386. <p>Ultra Grip Extreme</p>
  387. <figure>
  388. <img src="img/pic1.png" alt="pic1">
  389. </figure>
  390. <p>90.00 грн</p>
  391. </a>
  392. <a href="#" class="tovar">
  393. <h4>Nokian</h4>
  394. <p>Hakkapeliitta R</p>
  395. <figure>
  396. <img src="img/pic2.png" alt="pic2">
  397. </figure>
  398. <p>115.00 грн</p>
  399. </a>
  400. <a href="#" class="tovar">
  401. <h4>Hankook</h4>
  402. <p class="move">K 708 155/65 R14</p>
  403. <figure>
  404. <img src="img/pic3.png" alt="pic3">
  405. </figure>
  406. <p>393.00 грн</p>
  407. </a>
  408. </div>
  409.  
  410. </article>
  411.  
  412. <div class="brend">
  413. <figcaption class="main_capt2">
  414. <img src="img/copy.png" alt="copy sign" />
  415. <span>бренды:</span>
  416. </figcaption>
  417. <figcaption class="sec_capt">
  418. <img src="img/mark.png" alt="mark sign" />
  419. <span>шины</span>
  420. </figcaption>
  421. <form class="shiny" action="#" method="post">
  422. <div>
  423. <input type="checkbox" id="brend">
  424. <label for="brend">Бренд 1</label>
  425. </div>
  426. <div>
  427. <input type="checkbox" id="brend">
  428. <label for="brend">Бренд 2</label>
  429. </div>
  430. <div>
  431. <input type="checkbox" id="brend">
  432. <label for="brend">Бренд 3</label>
  433. </div>
  434. </form>
  435. <figcaption class="sec_capt">
  436. <img class="to_move" src="img/mark.png" alt="mark sign" />
  437. <span>диски</span>
  438. </figcaption>
  439. <form class="disk" action="#" method="post">
  440. <div>
  441. <input type="checkbox" id="brend">
  442. <label for="brend">Бренд 1</label>
  443. </div>
  444. <div>
  445. <input type="checkbox" id="brend">
  446. <label for="brend">Бренд 2</label>
  447. </div>
  448. <div>
  449. <input type="checkbox" id="brend">
  450. <label for="brend">Бренд 3</label>
  451. </div>
  452. <div>
  453. <button type="submit">выбрать</button>
  454. </div>
  455. </form>
  456. </div>
  457. </main>
  458.  
  459. <figure class="logos clearfix">
  460. <img src="img/logo.png" alt="logos" />
  461. </figure>
  462. <footer>
  463. <div class="nav">
  464. <ul>
  465. <li>
  466. <a href="http://locksmithpalmdaleca.com/>Locksmith </a>
  467. </li>
  468. <li>
  469. <a href="http://locksmithpalmdaleca.com/>Locksmith </a>
  470. </li>
  471. <li>
  472. <a href="http://locksmithpalmdaleca.com/>Locksmith </a>
  473. </li>
  474. <li>
  475. <a href="http://locksmithpalmdaleca.com/>Locksmith </a>
  476. </li>
  477. </ul>
  478. </div>
  479. <p>Создание сайта &copy; Global Vision
  480. </p>
  481. </footer>
  482. </div>
  483. </body>
  484.  
  485. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement