dohdoro

bobbyabout

Mar 24th, 2015
2,143
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 6.01 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3.  
  4. <head>
  5.  
  6.  
  7. <!--
  8.  
  9. █▀▀▄ █▀▀█ █░░█ █▀▀▄ █▀▀█ █▀▀█ █▀▀█   ▀▀█▀▀ █░░█ █▀▀ █▀▄▀█ █▀▀ █▀▀
  10. █░░█ █░░█ █▀▀█ █░░█ █░░█ █▄▄▀ █░░█   ░░█░░ █▀▀█ █▀▀ █░▀░█ █▀▀ ▀▀█
  11. ▀▀▀░ ▀▀▀▀ ▀░░▀ ▀▀▀░ ▀▀▀▀ ▀░▀▀ ▀▀▀▀   ░░▀░░ ▀░░▀ ▀▀▀ ▀░░░▀ ▀▀▀ ▀▀▀
  12.  
  13.  
  14. ABOUT ME PAGE BY DOHDORO//TUMBLR
  15.  
  16. -->
  17.  
  18. <title>{Title}</title>
  19. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  20. <link rel="shortcut icon" href="{Favicon}">
  21.  
  22.  
  23. <style type="text/css">
  24.  
  25. #tumblr_controls {position: fixed !important;}
  26. #tumblr_controls {-webkit-filter: invert(100%);}
  27. #tumblr_controls {opacity: 0.5; -webkit-transition: opacity 0.7s linear; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; transition: all 0.3s ease-out;}
  28. #tumblr_controls:hover {opacity: 1; -webkit-transition: opacity 0.7s linear; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; transition: all 0.5s ease-out;}
  29.  
  30.  
  31. /* Body */
  32.  
  33. body {
  34. font-family:arial;
  35. font-size:10px;
  36. letter-spacing:1px;
  37. color:#fff;
  38. background:#fff;
  39.  
  40. }
  41.  
  42. a {
  43. color:#232323;
  44. text-decoration:none;
  45.  
  46. }
  47.  
  48. a:hover {
  49. color:#888888;
  50.  
  51. }
  52.  
  53. b, strong {
  54. color:#232323;
  55.  
  56. }
  57.  
  58. i, em {
  59. color:#232323;
  60.  
  61. }
  62.  
  63. u {
  64. color:#232323;
  65.  
  66. }
  67.  
  68. /* Posts */
  69.  
  70. #wrapped {
  71. margin-top:200px;
  72. padding-bottom:150px;
  73. margin-left:auto;
  74. margin-right:auto;
  75. height:100%;
  76. width:500px;
  77.  
  78. }
  79.  
  80. /* Hover text */
  81.  
  82. #s-m-t-tooltip {
  83. z-index:99;
  84. padding:5px;
  85. background-color:#000;
  86. border:1px solid #fff;
  87. color:#fff;
  88. font-family:arial;
  89. font-size:10px;
  90. letter-spacing:1px;
  91. text-transform:uppercase;
  92.  
  93. }
  94.  
  95. /* Page borders - keep the borders the same color*/
  96.  
  97.  
  98. /* Top border*/
  99.  
  100. #bbordone {
  101. position:fixed;
  102. left:0;
  103. top:0;
  104. width:100%;
  105. height:250px;
  106. background:#fafafa; /* change the background to your choice*/
  107. border-bottom:1px solid #eee; /* border */
  108.  
  109. }
  110.  
  111. /* left border*/
  112.  
  113. #bbordtwo {
  114. position:fixed;
  115. left:0;
  116. bottom:0;
  117. width:100%;
  118. height:60px;
  119. background:#fff;
  120. border-top:1px solid #eee;
  121.  
  122. }
  123.  
  124. /* right border*/
  125.  
  126. #bbordfo {
  127. position:fixed;
  128. right:0;
  129. top:0;
  130. width:120px;
  131. height:100%;
  132. background:#fff;
  133. border-left:1px solid #eee;
  134.  
  135. }
  136.  
  137. /* bottom border */
  138.  
  139. #bbordtree {
  140. position:fixed;
  141. left:0;
  142. top:0;
  143. width:120px;
  144. height:100%;
  145. background:#fff;
  146. border-right:1px solid #eee;
  147.  
  148. }
  149.  
  150. /* About*/
  151.  
  152. #stuff {
  153. position:fixed;
  154. top:40%;
  155. margin-left:0;
  156.  
  157. }
  158.  
  159. .about p {
  160. color:#888; /* text color of your about me*/
  161. margin-left:30px;
  162. overflow:auto;
  163. width:450px;
  164. height:200px;
  165. padding:10px;
  166. text-align:justify;
  167. font-family:arial;
  168. font-size:12px;
  169.  
  170. }
  171.  
  172. /* About title */
  173.  
  174. .about h2 {
  175. border-top:1px solid #eee; /* title border */
  176. color:#232323; /* title text color*/
  177. width:500px;
  178. text-align:center;
  179. font-size:50px;
  180. padding:10px 20px 10px 20px;
  181. text-transform:lowercase;
  182. font-family:georgia;
  183. font-style:italic;
  184. font-weight:900;
  185.  
  186. }
  187.  
  188. /* Top image */
  189.  
  190. #topthing {
  191. position:fixed;
  192. top:0px;
  193.  
  194. }
  195.  
  196. #topthing img {
  197. height:250px; /* Keep the height of the image to this. if you make it larger it will not fit */
  198. margin-left:120px;
  199.  
  200. }
  201.  
  202. /* Page links */
  203.  
  204. #navigation {
  205. position:fixed;
  206. z-index:9;
  207. bottom:12px;
  208. margin-left:130px;
  209.  
  210.  
  211. }
  212.  
  213. #navigation a {
  214. display:inline-block;
  215. text-transform:uppercase;
  216. margin:10px;
  217. font-weight:bold;
  218. color:#888; /* link color */
  219.  
  220. }
  221.  
  222. </style>
  223.  
  224. <!-- DON'T MESS WITH THIS -->
  225.  
  226. <link href="style-my-tooltips.css" rel="stylesheet" type="text/css" />
  227. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script><script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script><script>(function($){$(document).ready(function(){$("[title]").style_my_tooltips();});})(jQuery);</script>
  228.  
  229.  
  230. </head>
  231. <body>
  232.  
  233. <!-- page borders -->
  234.  
  235. <div id="bbordone"></div>
  236. <div id="bbordtwo"></div>
  237. <div id="bbordtree"></div>
  238. <div id="bbordfo"></div>
  239.  
  240. <div id="wrapped">
  241.  
  242. <!-- Page image. Use a transparent image or an image with the same background as the top -->
  243.  
  244. <div id="topthing">
  245. <img src="http://static.tumblr.com/bj5zkci/689nloux0/untitled-2_copy.png" />
  246. </div>
  247.  
  248.  
  249.  
  250. <div id="stuff">
  251. <div class="about">
  252.  
  253.  
  254. <p>
  255.  
  256. <!-- Your about me. Make it long, add a quote / lyrics etc. -->
  257.  
  258. Lorem ipsum dolor sit amet, nisl eros consul sea ne, mollis malorum fabellas ad eum. Quem explicari an vix. Aliquando accommodare ad qui. Duo an scripta verterem, usu cu splendide adversarium liberavisse. Ne eos debet conclusionemque. Verear mediocrem vituperata eum ei, mediocrem complectitur nec te, nisl appellantur consequuntur vis no.
  259.  
  260. Mutat atqui referrentur nam ad, ut pri mollis virtute. Pro aperiam convenire inciderint in. Vix quis nostro ea, qui choro delicatissimi et. Usu rebum labores evertitur ut. His adhuc voluptatum an.
  261.  
  262. Qui ridens diceret interpretaris te, illum fastidii vim eu, te labores indoctum necessitatibus mel. Et vis iudico nusquam, no cum dicta tractatos. Elit ocurreret persequeris cu per, pertinacia disputationi vim at. Eos no propriae elaboraret, quo eu omnis diceret alterum. Accumsan copiosae qualisque ea eam, justo appareat maiestatis.
  263.  
  264. </p>
  265.  
  266. <!-- Your about me title -->
  267. <h2>
  268. kim jiwon <!-- Change it to your name or whatever you like -->
  269. </h2>
  270.  
  271. </div>
  272. </div>
  273.  
  274.  
  275. <div id="navigation">
  276. <a href="/">Index</a>
  277. <a href="/ask">Contact</a>
  278.  
  279. <!-- Page links -->
  280.  
  281. <a href="/">Twitter</a>
  282. <a href="/">instagram</a>
  283.  
  284. <!-- DO NOT REMOVE / You can change the "x" to what you like-->
  285. <a href="http://dohdoro.tumblr.com" title="credit">x</a>
  286. </div>
  287.  
  288.  
  289.  
  290.  
  291. </body>
  292. </div>
  293. </html>
Advertisement
Add Comment
Please, Sign In to add comment