API tools faq
paste
Advertisement
heavenlytales

Ships Page (Version 1)

heavenlytales
Apr 12th, 2013
2,817
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 5.80 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <!--
  4. created by heavenlytales
  5. inspired by darren-criss and pistachi-o
  6. please do not remove any credit
  7. thanks and enjoy!
  8. !-->
  9.  
  10. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  11.  
  12. <head>
  13.  
  14. <title>{Title}</title>
  15. <link rel="shortcut icon" href="{Favicon}">
  16. <link rel="altertnate" type="application/rss+xml" href="{RSS}">
  17.  
  18. <meta name="description" content="" />
  19.  
  20. <meta http-equiv="x-dns-prefetch-control" content="off"/></head>
  21.  
  22. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  23.  
  24. <style type="text/css">
  25.  
  26. body{
  27. color: # 462012;
  28. background-color: white;
  29. background-image: url("");
  30. background-position: top left;
  31. background-repeat: no-repeat;
  32. background-attachment: fixed;
  33. font-family: Lucida Sans Unicode;
  34. font-size: 10px;
  35. line-height: 100%;
  36. text-align: justify;
  37. }
  38.  
  39. a:link, a:active, a:visited{
  40. color: #57382D;
  41. text-decoration: none;
  42. }
  43.  
  44. a:hover{
  45. color: #7A5D42;
  46. text-decoration: none;
  47. }
  48.  
  49. #title {
  50. font-size: 18px;
  51. font-family: times;
  52. text-align: center;
  53. padding-bottom: 10px;
  54. padding-top: 20px;
  55. color: #301207;}
  56.  
  57. .box {
  58. color: #212121;
  59. float: left;
  60. width: 160px;
  61. background: #FFFFFF;
  62. margin: 2px;
  63. position: relative;
  64. overflow: hidden;
  65. }
  66.  
  67. .pic {
  68. margin: 0px;
  69. padding: 0px;
  70. width: 160px;
  71. height: 160px;
  72. }
  73.  
  74. .text {
  75. position: absolute;
  76. top: 5px;
  77. left: 4px;
  78. width: 120px;
  79. height: 140px;
  80. padding: 5px 16px;
  81. font-size: 11px;
  82. text-align: center;
  83. background: #FFFFFF;
  84. opacity: 0;
  85. -webkit-transition: .5s ease-in-out opacity;
  86. -moz-transition: .5s ease-in-out opacity;
  87. -o-transition: .5s ease-in-out opacity;
  88. transition: .5s ease-in-out opacity;
  89. }
  90.  
  91. .box:hover .text {
  92. opacity: 0.85;
  93. -webkit-transition: .5s ease-in-out opacity;
  94. -moz-transition: .5s ease-in-out opacity;
  95. -o-transition: .5s ease-in-out opacity;
  96. transition: .5s ease-in-out opacity;
  97. }
  98.  
  99. .box-title {
  100. margin: 10px 0px 4px;
  101. text-align: center;
  102. font-family: Lucida Sans Unicode;
  103. font-weight: 700;
  104. font-size: 12px;
  105. color: #2B2B2B;
  106. text-decoration: none;
  107. text-transform: uppercase;
  108. line-height: 100%;
  109. padding-bottom: 5px;
  110. border-bottom: 1px dotted #DDD;
  111. }
  112.  
  113. .quote {
  114. font-family: cambria;
  115. font-style: italic;
  116. padding: 5px;
  117. max-height: 140px;
  118. overflow: auto;
  119. }
  120.  
  121. .credit{
  122. position: absolute;
  123. bottom: 4px;
  124. right:4px;
  125. }
  126.  
  127. </style>
  128.  
  129. <center>
  130. <div id="title"><img src="http://25.media.tumblr.com/302230557aed1c01b38349c2935a9de7/tumblr_mkf7eaIAwK1rgfhy6o8_r1_500.png"></div>
  131.  
  132. <center><table width="780" border="0" cellpadding="0" cellspacing="3"><tbody align="center">
  133.  
  134. <!—START OF THE FIRST ROW DESCRIPTION (DON’T CHANGE THE FIRST ONE)--!>
  135.  
  136. <tr><td><b> </b><br/></td>
  137. <td><b>SHOW NAME</b><br/></td>
  138. <td><b>SHOW NAME</b><br/></td>
  139. <td><b>SHOW NAME</b><br/></td>
  140. <td><b>SHOW NAME</b><br/></td></tr>
  141.  
  142. <!—END OF THE FIRST ROW DESCRIPTION--!>
  143.  
  144.  
  145. <!—START OF THE FIRST ROW PICS (DON’T CHANGE THE FIRST BOX)--!>
  146.  
  147. <tr><td><div class="box cat1"><img src="http://25.media.tumblr.com/5b6420b2fe98b16a7ab17a6a90846472/tumblr_mkf7eaIAwK1rgfhy6o1_r2_250.png" width="160" height="160"><div class="text"><a href="/"><img src="http://25.media.tumblr.com/7c9790b1a9925bae1791f4c32bc3a920/tumblr_mkf7eaIAwK1rgfhy6o2_r2_250.png"></a></div></div>
  148. </td>
  149.  
  150. <td><div class="box cat1">
  151. <img src="(image)" width="160" height="160" class="pic">
  152. <div class="text">
  153. <div class="box-title">SHIP NAME</div>
  154. <div class="quote"> “Quote here.”</div>
  155. </div>
  156. </div></td>
  157.  
  158. <td><div class="box cat1">
  159. <img src="(image)" width="160" height="160" class="pic">
  160. <div class="text">
  161. <div class="box-title">SHIP NAME</div>
  162. <div class="quote"> “Quote here.”</div>
  163. </div>
  164. </div></td>
  165.  
  166. <td><div class="box cat1">
  167. <img src="(image)" width="160" height="160" class="pic">
  168. <div class="text">
  169. <div class="box-title">SHIP NAME</div>
  170. <div class="quote"> “Quote here.”</div>
  171. </div>
  172. </div></td>
  173.  
  174. <td><div class="box cat1">
  175. <img src="(image)" width="160" height="160" class="pic">
  176. <div class="text">
  177. <div class="box-title">SHIP NAME</div>
  178. <div class="quote"> “Quote here.”</div>
  179. </div>
  180. </div></td>
  181.  
  182. <!—END OF THE FIRST ROW PICS --!>
  183.  
  184.  
  185.  
  186.  
  187. <!—START OF THE SECOND ROW DESCRIPTION--!>
  188.  
  189. <tr><td><b>SHOW NAME</b><br/></td>
  190. <td><b>SHOW NAME</b><br/></td>
  191. <td><b>SHOW NAME</b><br/></td>
  192. <td><b>SHOW NAME</b><br/></td>
  193. <td><b>SHOW NAME</b><br/></td></tr>
  194.  
  195. <!—END OF THE SECOND ROW DESCRIPTION--!>
  196.  
  197.  
  198. <!—START OF THE SECOND ROW PICS--!>
  199.  
  200. <td><div class="box cat1">
  201. <img src="(image)" width="160" height="160" class="pic">
  202. <div class="text">
  203. <div class="box-title">SHIP NAME</div>
  204. <div class="quote"> “Quote here.”</div>
  205. </div>
  206. </div></td>
  207.  
  208. <td><div class="box cat1">
  209. <img src="(image)" width="160" height="160" class="pic">
  210. <div class="text">
  211. <div class="box-title">SHIP NAME</div>
  212. <div class="quote"> “Quote here.”</div>
  213. </div>
  214. </div></td>
  215.  
  216. <td><div class="box cat1">
  217. <img src="(image)" width="160" height="160" class="pic">
  218. <div class="text">
  219. <div class="box-title">SHIP NAME</div>
  220. <div class="quote"> “Quote here.”</div>
  221. </div>
  222. </div></td>
  223.  
  224. <td><div class="box cat1">
  225. <img src="(image)" width="160" height="160" class="pic">
  226. <div class="text">
  227. <div class="box-title">SHIP NAME</div>
  228. <div class="quote"> “Quote here.”</div>
  229. </div>
  230. </div></td>
  231.  
  232. <td><div class="box cat1">
  233. <img src="(image)" width="160" height="160" class="pic">
  234. <div class="text">
  235. <div class="box-title">SHIP NAME</div>
  236. <div class="quote"> “Quote here.”</div>
  237. </div>
  238. </div></td>
  239.  
  240. <!—END OF THE SECOND ROW PICS --!>
  241.  
  242.  
  243.  
  244. </tbody></table></center>
  245.  
  246. <div class="credit">code by <a href="http://heavenlytales.tumblr.com" target="_blank">heavenlytales</a></div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!