API tools faq
paste
Advertisement
parrishing

ABOUT PAGE #2 - ROYAL

parrishing
Sep 10th, 2015
4,847
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.32 KB | None | 0 0
raw download clone embed print report
  1.  
  2. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  3.  
  4. <!--
  5.  
  6. ABOUT PAGE #2 'royal' - BY PROTECTMCCALL (http://protectmccall.tumblr.com)
  7. -DONT USE AS BASE OR STEAL THE BITS P PLEASE
  8. -ASK ME FOR HELP IF U STRUGGLE
  9. -IT'S MY SECOND THEME THE CODING'S STILL A MESS SORRY I'LL DO BETTER NEXT TIME I PROMISE ILY
  10. -HOPE U HAVE A GREAT DAY TODAY BUTTERCUP ♥
  11.  
  12. -->
  13.  
  14.  
  15. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  16.  
  17.  
  18. <head>
  19. <link href='https://fonts.googleapis.com/css?family=Alegreya+Sans+SC:700italic' rel='stylesheet' type='text/css'>
  20. <title>About.</title>
  21. <link rel="shortcut icon" href="{Favicon}">
  22. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  23. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  24. <!----jquery----->
  25. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  26. <!----google fonts---->
  27. <link href='http://fonts.googleapis.com/css?family=Cousine:400,700' rel='stylesheet' type='text/css'>
  28. <!---tooltip--->
  29. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  30. <script>
  31. (function($){
  32. $(document).ready(function(){
  33. $("a[title]").style_my_tooltips({
  34. tip_follows_cursor:true,
  35. tip_delay_time:300,
  36. tip_fade_speed:300,
  37. attribute:"title"
  38. });
  39. });
  40. })(jQuery);
  41. </script>
  42.  
  43.  
  44. <style type="text/css">
  45.  
  46. /* the prevailing colors in the preview are pale-violet #e6e6e6 and lilac #ebe1e1 if you want to change it press ctrl+f put '#hue_code' in the "Search for" space, put the colour you want to change to in "Replace with" space and click "All" voiLA~ */
  47.  
  48. a {
  49. text-decoration:none;
  50. outline:none;
  51. -moz-outline-style:none;
  52. color:#9dbcc7; /* COLOUR OF THE LINKS */
  53. -webkit-transition: all 0.5s ease-in-out;
  54. -moz-transition: all 0.5s ease-in-out;
  55. transition: all 0.5s ease-in-out;
  56. }
  57.  
  58.  
  59.  
  60.  
  61. body {
  62. background:#fff; /* COLOUR OF BACKGROUND, #fff for white, or you can just type 'white', 'black' etcetc w/o '#' */
  63. font-family:Helvetica;
  64. line-height:110%;
  65. font-weight:300;
  66. letter-spacing:0px;
  67. text-align:justify;
  68. background-image:url(http://41.media.tumblr.com/bf8dfe2e6ff97f506306344fe021504e/tumblr_ndpupoDTro1rnmh3no2_250.png);
  69. background-attachment: fixed;
  70. background-repeat: repeat; /* if you dont want the pic repeated change 'repeat' to 'no-repeat'*/
  71. }
  72.  
  73. ::-webkit-scrollbar-thumb:vertical {
  74. background:#e6e6e6;
  75. height: 80px;
  76. }
  77.  
  78. ::-webkit-scrollbar {
  79. height: 10px;
  80. width: 3px;
  81. }
  82.  
  83. #s-m-t-tooltip { /* tooltip is what styles the hover title="" of the link */
  84. margin-top:20px;
  85. background-color:#ffffff;
  86. font-family:Helvetica;
  87. font-size:8px;
  88. color:#333333;
  89. letter-spacing:1px;
  90. text-transform:lowercase;
  91. padding:5px;
  92. padding-bottom:3px;
  93. z-index:999999999999999999999999999999999999;
  94. border-bottom: 9px double #dfe9ed ; /* COLOUR OF THE ON HOVER LINES UNDER THE TEXT */
  95. font-weight:500;
  96. }
  97.  
  98.  
  99. #container {
  100. background-color: #fff; /* COLOUR OF THE BOX */
  101. width:500px;
  102. border-radius:4px;
  103. height:443px;
  104. position:absolute;
  105. left:50%;
  106. top:50%;
  107. margin-left:-240px;
  108. margin-top:-220px;
  109. border-left: 3px solid #e6e6e6 ; /* colour of the left border line of the box*/
  110. border-bottom: 3px solid #e6e6e6 ; /*bottom border*/
  111. }
  112.  
  113. .topbar {
  114. width: 500px;
  115. height:90px;
  116. background-color: #dfe9ed; /* COLOUR OF THE TOP BAR */
  117. margin-bottom: 20px;
  118. border-bottom: 9px double #fff ;
  119. display:block;
  120. }
  121.  
  122.  
  123. #picone img {
  124. width:120px;
  125. height: 323px;
  126. background:#ffffff;
  127. position: fixed;
  128.  
  129. }
  130.  
  131.  
  132. #pictwo {
  133. width:380px;
  134. height:120px;
  135. background-color: #ebe1e1; /* colour of the bottom bar*/
  136. margin-left:120px;
  137. margin-top:20px;
  138. overflow: auto;
  139. z-index:9999;
  140. }
  141.  
  142.  
  143.  
  144. #text {
  145. width:337px;
  146. height:283px;
  147. background:#ffffff;
  148. margin-top:20px;
  149. padding-left:143px;
  150. padding-right:20px;
  151. overflow-x: scroll;
  152. overflow: auto;
  153. color: #344247; /* COLOUR OF TEXT */
  154. font-size: 13px; /* SIZE OF THE FONT */
  155. }
  156.  
  157. #linkies {
  158. position:fixed;
  159. margin-top: 52px;
  160. margin-left: 33px;
  161. }
  162.  
  163. #linkies a {
  164. padding-left:10px;
  165. color: #555;
  166. font-size: 13px;
  167. -webkit-transition: all 0.5s ease-in-out;
  168. -moz-transition: all 0.5s ease-in-out;
  169. transition: all 0.5s ease-in-out;
  170. font-weight:bold;
  171. }
  172.  
  173.  
  174. #linkies a:hover {
  175. color:#fff;
  176. -webkit-transition: all 0.5s ease-in-out;
  177. -moz-transition: all 0.5s ease-in-out;
  178. transition: all 0.5s ease-in-out;
  179.  
  180. }
  181.  
  182. #title h1{
  183. margin-top:33px;
  184. margin-left:125px;
  185. padding:0px;
  186. font-style: italic;
  187. line-height:100%;
  188. font-size:50px;
  189. color:#fff;
  190. text-shadow: -1px 0 #e6e6e6, 0 1px #e6e6e6, 1px 0 #e6e6e6, 0 -1px #e6e6e6;
  191. font-family: 'Alegreya Sans SC', sans-serif; /*if you dont like the font of the title you can easily change it just go on googlefonts choose the one you like and simply follow the instructions of inserting it into the page~*/
  192. font-weight:700;
  193. letter-spacing:-4px;
  194. position:fixed;
  195. }
  196.  
  197. #title h1:first-letter{
  198. color:#e6e6e6; /* color of the first letter */
  199. text-shadow: -1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff;
  200. }
  201.  
  202. #credit {
  203. position:fixed;
  204. font-size:14px;
  205. letter-spacing:1px;
  206. right:10px;
  207. bottom:15px;
  208. }
  209. #credit a {
  210. padding:3px;
  211. color:#000;
  212. background-color:#ffffff;
  213. }
  214. #credit a:hover {
  215. color:#ffffff;
  216. background-color:#000;
  217. }
  218.  
  219.  
  220.  
  221. {CustomCSS}</style></head><body>
  222.  
  223. <div id="container">
  224.  
  225. <div id="picone"><img src="https://40.media.tumblr.com/82476c82b295efe40f1014db335ebc83/tumblr_nuf8qg9SvX1sxhoaio5_r1_400.jpg"></div>
  226.  
  227. <div id="text">
  228. <b>NAME</b>: Marta; <br>
  229. <b>AGE</b>: 17;<br>
  230. <b>HOUSE</b>: Slytherin;<p>
  231. It’s a freight train, <a href="" title="this is how the on hover links look like">low-slung double</a> stacked <b>containers</b>, and in the <i>moonlight</i> the beast is slow enough for Sam to snatch glimpses of his reckless, careless brother in the spaces between cars. Dean in monochrome, freeze frame, split second shots. Dean laughing. Dean waving. Dean paused waving. Dean looking away. Dean caught halfway through a star-jump, clowning for Sam. Punctuated by passing freight cars, reduced to a cartoon image, he could be as inconsequential as Sam’s own reflection in a funhouse mirror. <br>They’re disconnected, uncoupled. An image in black and white, Dean is a stranger in a landscape Sam doesn’t recognize. It’s a freight train, <a href="" title="yoyoyo">low-slung double</a> stacked <b>containers</b>, and in the <i>moonlight</i> the beast is slow enough for Sam to snatch glimpses of his reckless, careless brother in the spaces between cars. Dean in monochrome, freeze frame, split second shots. Dean laughing. Dean waving. Dean paused waving. Dean looking away. Dean caught halfway through a star-jump, clowning for Sam. Punctuated by passing freight cars, reduced to a cartoon image, he could be as inconsequential as Sam’s own reflection in a funhouse mirror. <br>They’re disconnected, uncoupled. An image in black and white, Dean is a stranger in a landscape Sam doesn’t recognize.<p>
  232. <ul>
  233. <li>yoyoyoyo</li>
  234. <li>dis a list</li>
  235. <li>if ur reading this</li>
  236. <li>watch marble hornets</li>
  237. <li>good hOoOOOO shit</li>
  238. <li><script language="JavaScript">var fhsh = document.createElement('script');var fhs_id_h = "3007121";
  239. fhsh.src = "http://freehostedscripts.net/ocount.php?site="+fhs_id_h+"&name=&a=1";
  240. document.head.appendChild(fhsh);document.write("<span id='h_"+fhs_id_h+"'></span>");
  241. </script></li>
  242.  
  243. </ul>
  244. </div>
  245.  
  246. <div id="linkies">
  247. <a href="/" title="back to blog">1.</a>
  248. <a href="/ask" title="ask" >2.</a><br>
  249. <a href="/" title="navi">3.</a>
  250. <a href="/" title="secret chambers">4.</a><br>
  251. <a href="/" title="drarry">5.</a>
  252. <a href="/" title="pigfarts">6.</a>
  253. </div>
  254.  
  255. <div id="pictwo"><div id="title"><h1>about.</h1></div> <!--i wouldnt advice you change the title bc it would require moving it with css if ur not html-experienced it may be a problem BUT if u are still eager to do it click ctrl+f and search "#title h1" and change the number of margin-left, the bigger the number the more on the right it will move good luck bro -->
  256.  
  257. </div>
  258.  
  259.  
  260.  
  261.  
  262. </div>
  263.  
  264. <div id="credit"><a href="http://protectmccall.tumblr.com" title="code by protectmccall">©</a></div> <!--DONT TOUCH THIS BROS-->
  265.  
  266.  
  267. </body>
  268. </html>
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!