Advertisement
sparkychild

Noodling my way through HTML

Mar 31st, 2018
158
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.09 KB | None | 0 0
  1. /roomintro <!-- scrolling images --> <div style="background-color: green"> <marquee loop="true" scrollamount="5" style="border: 2px solid green; background-image: url(https://i.imgur.com/gBUoUum.jpg); padding: 0px; background-size: cover; height: 100px; background-position: bottom; padding-bottom: 0px; border-bottom: none"> <!-- image reference <div class="cafe-image" style="background-image: url();" title=""></div> --> <div class="cafe-image" style="background-image: url(https://i.imgur.com/G4EDTLm.jpg);background-size: cover; display: inline-block; border: 1.5px dashed green; box-shadow: white 0px 0px 50px inset; background-repeat: no-repeat; background-position: center center; height: 92px; width: 120px; margin-top: 2px; border-radius: 5px;" title="Trofie with Pesto"></div> <div class="cafe-image" style="background-image: url(http://cdn.cook.stbm.it/thumbnails/ricette/116/116035/hd750x421.jpg);background-size: cover; display: inline-block; border: 1.5px dashed green; box-shadow: white 0px 0px 50px inset; background-repeat: no-repeat; background-position: center center; height: 92px; width: 120px; margin-top: 2px; border-radius: 5px;" title="Carbonara Speghetti"></div> <div class="cafe-image" style="background-image: url(https://food.fnr.sndimg.com/content/dam/images/food/fullset/2014/4/8/2/FNM_050114-Amatriciana-Sauce-Recipe_s4x3.jpg.rend.hgtvcom.616.462.suffix/1397491331325.jpeg);background-size: cover; display: inline-block; border: 1.5px dashed green; box-shadow: white 0px 0px 50px inset; background-repeat: no-repeat; background-position: center center; height: 92px; width: 120px; margin-top: 2px; border-radius: 5px;" title="Bucatini with Amatriciana Sauce"></div> <div class="cafe-image" style="background-image: url(http://www.piattoforte.it/fileadmin/_processed_/csm_crop_43_lasagna-napoletana1086_5a989f16f4.jpg);background-size: cover; display: inline-block; border: 1.5px dashed green; box-shadow: white 0px 0px 50px inset; background-repeat: no-repeat; background-position: center center; height: 92px; width: 120px; margin-top: 2px; border-radius: 5px;" title="Lasagne Napoletana"></div> <div class="cafe-image" style="background-image: url(https://i0.wp.com/www.piccolericette.net/piccolericette/wp-content/uploads/2015/11/1198_farfalle.jpg?resize=895%2C616&amp;ssl=1);background-size: cover; display: inline-block; border: 1.5px dashed green; box-shadow: white 0px 0px 50px inset; background-repeat: no-repeat; background-position: center center; height: 92px; width: 120px; margin-top: 2px; border-radius: 5px;" title="Farfalle"></div> <div class="cafe-image" style="background-image: url(https://www.thefedupfoodie.com/wp-content/uploads/2017/11/IMG_4704-1.jpg);background-size: cover; display: inline-block; border: 1.5px dashed green; box-shadow: white 0px 0px 50px inset; background-repeat: no-repeat; background-position: center center; height: 92px; width: 120px; margin-top: 2px; border-radius: 5px;" title="Angel Hair"></div> <div class="cafe-image" style="background-image: url(http://cdn-image.foodandwine.com/sites/default/files/styles/medium_2x/public/201001-xl-orecchiette-with-veal-capers-and-white-wine.jpg?itok=gqwYdE4v);background-size: cover; display: inline-block; border: 1.5px dashed green; box-shadow: white 0px 0px 50px inset; background-repeat: no-repeat; background-position: center center; height: 92px; width: 120px; margin-top: 2px; border-radius: 5px;" title="Orecchiette with Veal Capers"></div> <div class="cafe-image" style="background-image: url(https://www.recipetineats.com/wp-content/uploads/2017/03/Baked-Mac-and-Cheese-12-2.jpg);background-size: cover; display: inline-block; border: 1.5px dashed green; box-shadow: white 0px 0px 50px inset; background-repeat: no-repeat; background-position: center center; height: 92px; width: 120px; margin-top: 2px; border-radius: 5px;" title="Baked Mac and Cheese"></div> <div class="cafe-image" style="background-image: url(http://assets.kraftfoods.com/recipe_images/opendeploy/Baked-Penne-1701_640x428.jpg);background-size: cover; display: inline-block; border: 1.5px dashed green; box-shadow: white 0px 0px 50px inset; background-repeat: no-repeat; background-position: center center; height: 92px; width: 120px; margin-top: 2px; border-radius: 5px;" title="Baked Penne"></div> <div class="cafe-image" style="background-image: url(http://www.motherthyme.com/wp-content/uploads/2016/07/cheesy-taco-pasta_.jpg);background-size: cover; display: inline-block; border: 1.5px dashed green; box-shadow: white 0px 0px 50px inset; background-repeat: no-repeat; background-position: center center; height: 92px; width: 120px; margin-top: 2px; border-radius: 5px;" title="Cheesy Taco Fusilli"></div> <div class="cafe-image" style="background-image: url(https://i.pinimg.com/originals/cf/99/d0/cf99d06672469b8381ba467f7799a15c.jpg);background-size: cover; display: inline-block; border: 1.5px dashed green; box-shadow: white 0px 0px 50px inset; background-repeat: no-repeat; background-position: center center; height: 92px; width: 120px; margin-top: 2px; border-radius: 5px;" title="Seafood Linguine"></div> </marquee> <!-- table with the buttons --> <center> <table style="width: 100%; background-image: url(https://upload.wikimedia.org/wikipedia/en/0/03/Flag_of_Italy.svg); background-size: contain; padding-top: 0px"> <tbody><tr> <!-- Column 1: rules, site and theme --> <td style="width: 25%"> <a href="https://cafelewows.weebly.com/rules.html"><button style="color: black; border: 1px solid brown; border-radius: 7px; background-color: cornsilk; padding: 3px; width: 125px; margin-bottom: 2px; box-shadow: rgba(34, 139, 34, 0.5) 0px 0px 10px inset, rgba(255, 255, 255, 0.7) 0px 0px 15px;">Rules</button></a><br> <a href="https://cafelewows.weebly.com/"><button style="color: black; border: 1px solid brown; border-radius: 7px; background-color: cornsilk; padding: 3px; width: 125px; margin-bottom: 2px; box-shadow: rgba(34, 139, 34, 0.5) 0px 0px 10px inset, rgba(255, 255, 255, 0.7) 0px 0px 15px;">Website</button></a><br> <a href="https://cafelewows.weebly.com/theme.html"><button style="color: black; border: 1px solid brown; border-radius: 7px; background-color: cornsilk; padding: 3px; width: 125px; margin-bottom: 2px; box-shadow: rgba(34, 139, 34, 0.5) 0px 0px 10px inset, rgba(255, 255, 255, 0.7) 0px 0px 15px;">Theme</button></a> </td> <!-- Center Column: welcome and quote --> <td style="text-align: center"> <div style="font-style: italic; background: cornsilk; border-radius: 15px; padding: 3px; padding-bottom: 10px; border: 2px solid brown; font-size: 8pt; box-shadow: inset 0 0 20px rgba(255,255,255,0.7), 0 0 20px rgba(255,255,255,0.8); color: blue">“Pasta doesn't make you fat. How much pasta you eat makes you fat.” - Giada De Laurentiis</div> <div style="font-weight: bold; background: cornsilk; border-radius: 15px; padding: 3px; margin-top: -5px; border: 2px solid brown; box-shadow: inset 0 0 20px rgba(255,255,255,0.7), 0 0 10px rgba(255,255,255,0.4); color: blue;">Welcome to The Café!</div> </td> <!-- Column 3: article, foodmons link and beginner tips. --> <td style="text-align: right; width: 25%"> <a href="http://www.smogon.com/articles/behind-the-kitchen"><button style="color: black; border: 1px solid brown; border-radius: 7px; background-color: cornsilk; padding: 3px; width: 125px; margin-bottom: 2px; box-shadow: rgba(34, 139, 34, 0.5) 0px 0px 10px inset, rgba(255, 255, 255, 0.7) 0px 0px 15px;">Article</button></a><br> <a href="http://www.smogon.com/forums/threads/cafe-le-wow-foodmons-wip.3626213/"><button style="color: black; border: 1px solid brown; border-radius: 7px; background-color: cornsilk; padding: 3px; width: 125px; margin-bottom: 2px; box-shadow: rgba(34, 139, 34, 0.5) 0px 0px 10px inset, rgba(255, 255, 255, 0.7) 0px 0px 15px;">Foodmons</button></a><br> <a href="https://docs.google.com/document/d/e/2PACX-1vT4wuf0CBSpr3Zyuv6KZCcquEUFuABt1XfLsE1SZYddtnfWrDQwpbMcARtGt4A7x5jTVVvg7aLjI3zS/pub"><button style="color: black; border: 1px solid brown; border-radius: 7px; background-color: cornsilk; padding: 3px; width: 125px; margin-bottom: 2px; box-shadow: rgba(34, 139, 34, 0.5) 0px 0px 10px inset, rgba(255, 255, 255, 0.7) 0px 0px 15px;">Beginner Tips</button></a> </td> </tr> </tbody></table> </center> </div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement