API tools faq
paste
fiansyahmm

Untitled

fiansyahmm
Dec 1st, 2021
17
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.51 KB | None | 0 0
raw download clone embed print report
  1. <!-- daftar makanan -->
  2. <!DOCTYPE html>
  3. <html lang="en">
  4.  
  5. <head>
  6. <meta charset="UTF-8">
  7. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  8. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  9. <style>
  10. img {
  11. cursor: url("https://static.cargo.site/images/up.png"), auto !important;
  12. }
  13.  
  14. header,
  15. section,
  16. footer,
  17. aside,
  18. nav,
  19. article,
  20. figure,
  21. figcaption {
  22. display: block;
  23. }
  24.  
  25. body {
  26. color: #666666;
  27. background-color: #f9f8f;
  28. background-image: url(https://img.freepik.com/free-photo/wooden-background_24972-623.jpg?size=626&ext=jpg);
  29. background-position: center;
  30. font-family: georgia, times, serif;
  31. line-height: 1.4em;
  32. margin: 0px;
  33. }
  34.  
  35. .wrapper {
  36. width: 940px;
  37. margin: 20px auto 20px auto;
  38. border: 2px solid #000000;
  39. background-color: #fff;
  40. }
  41.  
  42. header {
  43. height: 160px;
  44. background-image: url(http://www.nyekrip.com/wp-content/uploads/2015/custom/images/header.png);
  45. }
  46.  
  47. h1 {
  48. text-indent: -9999px;
  49. width: 940px;
  50. height: 130px;
  51. margin: 0px;
  52. }
  53.  
  54. nav,
  55. footer {
  56. clear: both;
  57. color: #FFFFFF;
  58. background-color: #aeaca8;
  59. height: 30px;
  60. }
  61.  
  62. nav ul {
  63. margin: 0px;
  64. padding: 5px 0px 5px 30px;
  65. }
  66.  
  67. nav li {
  68. display: inline;
  69. margin-right: 40px;
  70. }
  71.  
  72. nav li a {
  73. color: #FFFFFF;
  74. }
  75.  
  76. na li a:hover,
  77. nav li a.current {
  78. color: #000000;
  79. }
  80.  
  81. section.courses {
  82. float: left;
  83. width: 659px;
  84. border-right: 1px solid #eeeeee;
  85. }
  86.  
  87. article {
  88. clear: both;
  89. overflow: auto;
  90. width: 100%;
  91. }
  92.  
  93. hgroup {
  94. margin: top 40px;
  95. }
  96.  
  97. figure {
  98. float: left;
  99. width: 290px;
  100. height: 220px;
  101. padding: 5px;
  102. margin: 20px;
  103. border: 1px solid #eeeeee;
  104. }
  105.  
  106. figcaption {
  107. font-size: 90%;
  108. text-align: left;
  109. }
  110.  
  111. aside {
  112. width: 20px;
  113. float: left;
  114. padding: 0px 0px 0px 20px;
  115. }
  116.  
  117. aside section a {
  118. display: block;
  119. padding: 10px;
  120. border-bottom: 1px solid #eeeeee;
  121. }
  122.  
  123. aside sexrion a:hover {
  124. background-color: #efefef;
  125. }
  126.  
  127. a {
  128. color: #de6581;
  129. text-decoration: none;
  130. }
  131.  
  132. h1,
  133. h2,
  134. h3 {
  135. font-weight: normal;
  136. }
  137.  
  138. h2 {
  139. margin: 10px 0pc 5px 0px;
  140. padding: 0px;
  141. }
  142.  
  143. h3 {
  144. margin: 0px 0px 10px 0px;
  145. color: #de6581;
  146. }
  147.  
  148. aside h2 {
  149. padding: 30px 0px 10px 0px;
  150. color: #de6581;
  151. }
  152.  
  153. footer {
  154. font: size 80%;
  155. padding: 7px 0px 0px 20px;
  156. }
  157.  
  158. .row {
  159. display: flex;
  160. }
  161.  
  162. .column {
  163. flex: 50%;
  164. }
  165.  
  166. .container {
  167. width: 100%;
  168. height: auto;
  169. margin-right: auto;
  170. margin-left: auto;
  171. }
  172. </style>
  173. <title>Web Warung Tegal</title>
  174. </head>
  175.  
  176. <body>
  177. <!-- wrapper -->
  178. <div class="wrapper">
  179. <header>
  180. <h1>Warrung Tegal</h1>
  181. <nav>
  182. <ul>
  183. <li><a href="https://fiansyahm.github.io/pweb.github.io/pweb-3-1.html" class="current">Beranda</a></li>
  184. <li><a href="https://fiansyahm.github.io/pweb.github.io/pweb-3-2.html">Daftar Makanan</a></li>
  185. <li><a href="https://fiansyahm.github.io/pweb.github.io/pweb-3-3.html">Review</a></li>
  186. <li><a href="https://fiansyahm.github.io/pweb.github.io/pweb-3-4.html">Tentang</a></li>
  187. <li><a href="https://fiansyahm.github.io/pweb.github.io/pweb-3-5.html">Kontak</a></li>
  188. </ul>
  189. </nav>
  190. </header>
  191. <section class="courses" align="center">
  192. <table bgcolor="white" border="2" align="center">
  193. <caption align="top">
  194. <font size="5" color="white" face="elephant">
  195. Makanan:</font>
  196. </caption>
  197. <tr bgcolor="darkorange">
  198. <td colspan=3 align="center"><b>Menu Pembuka</b></td>
  199. </tr>
  200. <tr bgcolor="yellow">
  201. <th>No</th>
  202. <th>Nama Makanan</th>
  203. <th>Harga</th>
  204. </tr>
  205. <tr background="cover4.png">
  206. <td align="center" width="30">1</td>
  207. <td align="left" width="500" height="30">Soto</td>
  208. <td align="right" width="70" height="30">12.500</td>
  209. </tr>
  210. <tr background="cover4.png">
  211. <td align="center" width="30">2</td>
  212. <td align="left">Pecel</td>
  213. <td align="right">10.000</td>
  214. </tr>
  215. <tr background="cover4.png">
  216. <td align="center">3</td>
  217. <td align="left">Bakso</td>
  218. <td align="right">9.000</td>
  219. </tr>
  220. <tr background="cover4.png">
  221. <td align="center">4</td>
  222. <td align="left">Lodho</td>
  223. <td align="right">15.000</td>
  224. </tr>
  225. <tr background="cover4.png">
  226. <td align="center">5</td>
  227. <td align="left">Sate</td>
  228. <td align="right">10.000</td>
  229. </tr>
  230. <tr background="cover4.png">
  231. <td align="center">6</td>
  232. <td align="left">Steak</td>
  233. <td align="right">Rujak</td>
  234. </tr>
  235. <tr background="cover4.png">
  236. <td align="center">7</td>
  237. <td align="left">Gado Gado</td>
  238. <td align="right">8.000</td>
  239. </tr>
  240. <tr background="cover4.png">
  241. <td align="center">8</td>
  242. <td align="left">Tempe & Tahu Goreng</td>
  243. <td align="right">9.000</td>
  244. </tr>
  245. <tr bgcolor="darkorange">
  246. <td colspan=3 align="center"><b>Dessert</b></td>
  247. </tr>
  248. <tr bgcolor="yellow">
  249. <th>No</th>
  250. <th>Nama Makanan</th>
  251. <th>Harga</th>
  252. </tr>
  253. <tr background="cover4.png">
  254. <td align="center">1</td>
  255. <td align="left" width="500" height="30">Salad Buah</td>
  256. <td align="right" width="70" height="30">7.000</td>
  257. </tr>
  258. <tr background="cover4.png">
  259. <td align="center">2</td>
  260. <td align="left">Roti Bakar</td>
  261. <td align="right">9.000</td>
  262. </tr>
  263. <tr background="cover4.png">
  264. <td align="center">3</td>
  265. <td align="left">Serabi</td>
  266. <td align="right">15.000</td>
  267. </tr>
  268. <tr background="cover4.png">
  269. <td align="center">4</td>
  270. <td align="left">Pisang Goreng</td>
  271. <td align="right">9.000</td>
  272. </tr>
  273. <tr background="cover4.png">
  274. <td align="center">5</td>
  275. <td align="left">Pukis</td>
  276. <td align="right">11.000</td>
  277. </tr>
  278. <tr background="cover4.png">
  279. <td align="center">4</td>
  280. <td align="left">Sop Buah</td>
  281. <td align="right">5.500</td>
  282. </tr>
  283. <table bgcolor="white" border="2" align="center">
  284. <caption align="top">
  285. <font size="5" color="white" face="elephant">
  286. Minuman:</font>
  287. </caption>
  288. <tr bgcolor="darkorange">
  289. <td colspan=3 align="center"><b>Hot/Cold Drinks</b></td>
  290. </tr>
  291. <tr bgcolor="yellow">
  292. <th>No</th>
  293. <th>Nama Minuman</th>
  294. <th>Harga</th>
  295. </tr>
  296. <tr background="cover4.png">
  297. <td align="center" width="20">1</td>
  298. <td align="left" width="500" height="30">Soda Gembira</td>
  299. <td align="right" width="70" height="30">5.000</td>
  300. </tr>
  301. <tr background="cover4.png">
  302. <td align="center" width="30">2</td>
  303. <td align="left">Es Mega Mendung</td>
  304. <td align="right">9.000</td>
  305. </tr>
  306. <tr background="cover4.png">
  307. <td align="center" width="30">3</td>
  308. <td align="left">Es Oyen</td>
  309. <td align="right">8.000</td>
  310. </tr>
  311. <tr background="cover4.png">
  312. <td align="center" width="30">4</td>
  313. <td align="left">Teh</td>
  314. <td align="right">3.000</td>
  315. </tr>
  316. <tr background="cover4.png">
  317. <td align="center" width="30">4</td>
  318. <td align="left">Lemon tea</td>
  319. <td align="right">4.000</td>
  320. </tr>
  321. <tr bgcolor="darkorange">
  322. <td colspan=3 align="center"><b>Fresh Juice</b></td>
  323. </tr>
  324. <tr bgcolor="yellow">
  325. <th>No</th>
  326. <th>Nama Minuman</th>
  327. <th>Harga</th>
  328. </tr>
  329. <tr background="cover4.png">
  330. <td align="center" width="20">1</td>
  331. <td align="left" width="500" height="30">Mangga</td>
  332. <td align="right" width="70" height="30">5.000</td>
  333. </tr>
  334. <tr background="cover4.png">
  335. <td align="center" width="30">2</td>
  336. <td align="left">Jeruk</td>
  337. <td align="right">5.000</td>
  338. </tr>
  339. <tr background="cover4.png">
  340. <td align="center" width="30">3</td>
  341. <td align="left">Wortel</td>
  342. <td align="right">5.000</td>
  343. </tr>
  344. <tr background="cover4.png">
  345. <td align="center" width="30">4</td>
  346. <td align="left">Alpukat</td>
  347. <td align="right">5.000</td>
  348. </tr>
  349. <tr background="cover4.png">
  350. <td align="center" width="30">5</td>
  351. <td align="left">Guava</td>
  352. <td align="right">5.000</td>
  353. </tr>
  354. <tr background="cover4.png">
  355. <td align="center" width="30">6</td>
  356. <td align="left">Strawberry</td>
  357. <td align="right">5.000</td>
  358. </tr>
  359. <tr background="cover4.png">
  360. <td align="center" width="30">7</td>
  361. <td align="left">Tomat</td>
  362. <td align="right">5.000</td>
  363. </tr>
  364. </table>
  365. </section>
  366. <aside>
  367. <section class="popular-recipes">
  368. <h2>Masakan popular</h2>
  369. <a href="">Sayur Sop</a>
  370. <a href="">Sayur Asem</a>
  371. <a href="">Sayur Lodeh</a>
  372. <a href="">Sayur Bayam</a>
  373. </section>
  374. <section class="contact-details">
  375. <h2>Kontak</h2>
  376. <p>Warung Tegal</br>
  377. di seluruh indonesia
  378. </section>
  379. <section class="contact-details">
  380. <h2>Rating Warung</h2>
  381. <img src="https://e7.pngegg.com/pngimages/658/490/png-clipart-longitude-131xb0-car-5-star-pics-of-a-star-angle-text.png" alt="" width="100">
  382. </section>
  383. </aside>
  384. <footer>
  385. &copy 2021 Warung Tegal
  386. </footer>
  387. </div>
  388. <!-- end wrapper -->
  389. </body>
  390.  
  391. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!