Advertisement
regardis

Tumblr Theme Page: Lista de Películas vistas en 2015

Jan 12th, 2015
525
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.63 KB | None | 0 0
  1. <HTML>
  2. <!--
  3. REGARDIS - TUMBLR THEMES
  4. Tumblr Themes: http://regardis.tumblr.com
  5. -->
  6. <head>
  7. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  8. <title> Películas vistas en el 2015</title>
  9. <style>
  10.  
  11. body{
  12. font-family: Arial;
  13. font-size: 14px;
  14. }
  15.  
  16. #credito{
  17. position: fixed;
  18. padding: 6px;
  19. left: 6px;
  20. bottom: 7px;
  21. height: 10px;
  22. width: 11px;
  23. }
  24.  
  25. #central{
  26. width: 1000px;
  27. margin: 0 auto;
  28. text-align: center;
  29. }
  30.  
  31. .mini{
  32. font: 10px Myriad Pro;
  33. line-height: 22px;
  34. }
  35.  
  36. .min{
  37. text-decoration: none;
  38. color: #996699;
  39. }
  40.  
  41. h2{
  42. text-align:center;
  43. font-family: helvetica;
  44. line-height: 50px;
  45. text-transform: uppercase;
  46. letter-spacing: 20px;
  47. margin: 0;
  48. padding: 5px;
  49. }
  50.  
  51. .subb{
  52. font: 10px Helvetica;
  53. text-transform: uppercase;
  54. letter-spacing: 8px;
  55. }
  56.  
  57. #peliculas{
  58. width: 900px;
  59. padding: 10 0 10 0;
  60. margin: 0 auto;
  61. text-align: center;
  62. }
  63. .peli{
  64. display: inline-block;
  65. width: 220px;
  66. height: 160px;
  67. text-align:center;
  68. border: 1px solid #000;
  69. margin: 5px;
  70. }
  71.  
  72. .mov{
  73. width: 100px;
  74. height: 150px;
  75. vertical-align: middle;
  76. }
  77.  
  78. .ttt{
  79. font: 16px Myriad Pro;
  80. }
  81.  
  82. .ttm{
  83. height: 150px;
  84. display: table;
  85. background-color: #eee;
  86. vertical-align: middle;
  87. width: 210px;
  88. margin-top: 5px;
  89. margin-left: 5px;
  90. }
  91.  
  92. .ttw{
  93. height: 150px;
  94. display: table-cell;
  95. vertical-align: middle;
  96. text-align: center;
  97. width: 110px;
  98. }
  99.  
  100. .ttz{
  101. display: inline-block;
  102. float: right;
  103. width: 100px;
  104. }
  105.  
  106. .uno{
  107. width: 97px;
  108. height: 19px;
  109. margin: 0 auto;
  110. background-image: url('http://static.tumblr.com/nhmqbs6/tB5ni2ygw/one-star.png');
  111. }
  112. .dos{
  113. width: 97px;
  114. height: 19px;
  115. margin: 0 auto;
  116. background-image: url('http://static.tumblr.com/nhmqbs6/UdEni2ygm/two-star.png');
  117. }
  118.  
  119. .tres{
  120. width: 97px;
  121. height: 19px;
  122. margin: 0 auto;
  123. background-image: url('http://static.tumblr.com/nhmqbs6/e58ni2yg7/three-star.png');
  124. }
  125.  
  126. .cuatro{
  127. width: 97px;
  128. height: 19px;
  129. margin: 0 auto;
  130. background-image: url('http://static.tumblr.com/nhmqbs6/fLMni2yfd/four-star.png');
  131. }
  132.  
  133. .cinco{
  134. width: 97px;
  135. height: 19px;
  136. margin: 0 auto;
  137. background-image: url('http://static.tumblr.com/nhmqbs6/K2Uni2yex/five-star.png');
  138. }
  139. </style>
  140. </head>
  141. <body>
  142. <!--
  143. //////////////LEER ANTES:
  144. Para agregar una película, copia el siguiente código y pégalo donde desees mostrar la película. No te olvides de reemplazar cada dato como URL y TÍTULOS.
  145.  
  146. <div class="peli">
  147. <div class="ttm">
  148. <div class="ttw">
  149. <span class="ttt">TÍTULO DE LA PELÍCULA</span><br>
  150. <div class="# DE ESTRELLAS">
  151. </div>
  152. <div class="ttz">
  153. <img src="URL DEL POSTER DE PELÍCULA" class="mov" title="TÍTULO DE PELÍCULA / COMENTARIO / FECHA VISTA">
  154. </div>
  155. </div>
  156. </div>
  157.  
  158.  
  159. /////////// NOTA
  160. Donde dice "# DE ESTRELLAS" se debe poner el número de estrellas que le das a la película en letras. Por ejemplo "cinco", "cuatro", "tres", "dos", "uno".
  161.  
  162. Donde dice "TÍTULO DE PELÍCULA / COMENTARIO / FECHA VISTA" puedes elegir colocar la fecha en la que vistes, comentarios sobre la película o simplemente el título de la película. Esta información se verá cuando pongas el cursor encima de la imagen.
  163.  
  164. -->
  165.  
  166. <div id="central">
  167. <h2>Películas vistas en el 2015</h2>
  168. <span class="subb">Mantén el cursor sobre las imágenes para ver más información</span><br>
  169. <span class="mini"><a class="min" href="/">volver a mi tumblr</a></span>
  170. <div id="peliculas">
  171.  
  172. <!-- COMIENZA LA LISTA DE PELÍCULAS -->
  173. <div class="peli">
  174. <div class="ttm">
  175. <div class="ttw">
  176. <span class="ttt">A lot like Love</span><br>
  177. <div class="cinco"></div>
  178. </div>
  179. <div class="ttz">
  180. <img src="http://i.imgur.com/9jbseIl.jpg" class="mov" title="Vista: 02/12/13">
  181. </div>
  182. </div>
  183. </div>
  184.  
  185. <div class="peli">
  186. <div class="ttm">
  187. <div class="ttw">
  188. <span class="ttt">A lot like Love</span><br>
  189. <div class="cinco"></div>
  190. </div>
  191. <div class="ttz">
  192. <img src="http://i.imgur.com/9jbseIl.jpg" class="mov" title="Comentario sobre la película">
  193. </div>
  194. </div>
  195. </div>
  196.  
  197. <div class="peli">
  198. <div class="ttm">
  199. <div class="ttw">
  200. <span class="ttt">TÍTULO DE LA PELÍCULA</span><br>
  201. <div class="cuatro"></div>
  202. </div>
  203. <div class="ttz">
  204. <img src="URL DEL POSTER DE PELÍCULA" class="mov" title="TÍTULO DE PELÍCULA / COMENTARIO / FECHA VISTA">
  205. </div>
  206. </div>
  207. </div>
  208.  
  209.  
  210.  
  211. <!-- FIN DE LISTA DE PELÍCULAS -->
  212. <div class="mini">theme <a class="min" href="http://regardis.tumblr.com">@ regardis</a></div>
  213. </div>
  214. <div id="credito"><a href="http://regardis.tumblr.com"><img src="http://static.tumblr.com/nhmqbs6/VWgmiwkvz/rpng.png"></a></div>
  215. </body>
  216. </HTML>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement