API tools faq
paste
Advertisement
alokasenna

Navigation Base

alokasenna
May 23rd, 2014
1,536
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.23 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. <html>
  3.  
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  5.  
  6. <!--BASE BY STVCKY (ODINSSON.CO.VU). YOU CAN REMOVE THE CREDIT. RELEASE AS YOUR OWN THEME. KEEP THE CREDIT. CHANGE THE CREDIT. I DON'T CARE REALLY. THIS BASE IS HERE FOR YOUR USE SO DON'T LET ME HINDER YOU.-->
  7.  
  8. <head>
  9.  
  10. <title>Navigation Base</title> <!-----CHANGE THE TITLE ON THE TAB HERE----->
  11. <link rel="shortcut icon" href="https://31.media.tumblr.com/9e1d9727251fc920c698018e66b7d085/tumblr_n60igtfdqJ1tpb7s5o1_100.jpg"> <!-----CHANGE THE ICON ON THE TAB HERE----->
  12. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  13.  
  14.  
  15. <style type="text/css">
  16.  
  17. /*THESE ARE THE CUSTOM FONTS I'M USING IN THIS BASE. IF YOU WANT TO CHANGE THEM TO YOUR OWN CUSTOM FONTS, YOU CAN LOOK UP A TUTORIAL ON HOW TO DO SO*/
  18.  
  19. @font-face{font-family:ball;src:url(http://static.tumblr.com/9wzbixa/cf6mj2fv4/ballw___.ttf);}
  20.  
  21. @font-face { font-family: "b"; src: url('http://static.tumblr.com/cvlbtjz/cnsln9tpp/bebasneue.otf'); }
  22.  
  23.  
  24.  
  25. ::-webkit-scrollbar-thumb {
  26. background-color: #000; /*CHANGE THE SCROLLBAR*/
  27. height:auto;
  28. border-bottom:none;
  29. }
  30. ::-webkit-scrollbar {
  31. height:9px;
  32. width:5px;
  33. background-color: #000; /*CHANGE THE SCROLLBAR*/
  34. border: 2px solid #fcfcfc; /*MATCH THIS TO THE BG COLOR OF THE CONTAINER*/
  35.  
  36. }
  37.  
  38. ::selection {
  39. background-color: #857d72;
  40. color: #fcfcfc;
  41. }
  42.  
  43. body {
  44. background-color: #fcfcfc;
  45. background-image: url(/);
  46. background-repeat: repeat;
  47. }
  48.  
  49.  
  50. a {
  51. text-decoration: none;
  52. -webkit-transition: 0.5s;
  53. -moz-transition: 0.5s;
  54. transition: 0.5s;
  55. color: #000;
  56. }
  57.  
  58. a: hover {
  59. text-decoration: none;
  60. -webkit-transition: 0.5s;
  61. -moz-transition: 0.5s;
  62. transition: 0.5s;
  63. color: white;
  64. }
  65.  
  66. b, strong {
  67. color: #000;
  68. }
  69.  
  70. i, em {
  71. color: #000;
  72. }
  73.  
  74. /*THIS IS THE CODING FOR ALL COLUMNS*/
  75.  
  76. #columns {
  77. width: 200px;
  78. height: 400px;
  79. margin-top: 150px;
  80. position: fixed;
  81. border-top: 50px solid black;
  82. overflow-y: scroll;
  83. }
  84.  
  85. /*THIS IS THE CODING FOR THE FIRST COLUMN*/
  86.  
  87. #columni {
  88. margin-left: 150px;
  89. }
  90.  
  91. /*THIS IS THE CODING FOR THE SECOND COLUMN*/
  92.  
  93. #columnii {
  94. margin-left: 400px;
  95. }
  96.  
  97. /*THIS IS THE CODING FOR THE THIRD COLUMN*/
  98.  
  99. #columniii {
  100. margin-left: 650px;
  101. }
  102.  
  103. /*THIS IS THE CODING FOR THE FOURTH COLUMN*/
  104.  
  105. #columniv {
  106. margin-left: 900px;
  107. }
  108.  
  109. /*THIS IS THE CODING FOR THE NAVIGATION LINKS*/
  110.  
  111. .linkage {
  112. width: 100%;
  113. height: 18px;
  114. margin-top: 10px;
  115. padding-top: 2px;
  116. background-color: black;
  117. text-align: center;
  118. font-size: 15px;
  119. font-family: arial;
  120. }
  121.  
  122. .linkage a {
  123. color: #fcfcfc;
  124. }
  125.  
  126. /*THIS IS THE CODING FOR THE SECTIONS' TITLES*/
  127.  
  128. .titles {
  129. font-family: ball;
  130. color: #fcfcfc;
  131. font-size: 50px;
  132. position: fixed;
  133. margin-top: -50px;
  134. margin-left: 55px;
  135. }
  136.  
  137. /*THIS IS THE CODING FOR THE PAGE'S TITLE*/
  138.  
  139. #title {
  140. color: black;
  141. font-family: b;
  142. font-size: 100px;
  143. }
  144.  
  145. </style>
  146. </head>
  147.  
  148. <body>
  149.  
  150. <!--FIRST COLUMN STARTS-->
  151.  
  152. <div id="columni">
  153.  
  154. <div id="columns">
  155.  
  156. <div class="titles">
  157. title
  158. </div>
  159.  
  160. <div class="linkage">
  161. <a href="/">link</a>
  162. </div>
  163. <div class="linkage">
  164. <a href="/">link</a>
  165. </div>
  166. <div class="linkage">
  167. <a href="/">link</a>
  168. </div>
  169. <div class="linkage">
  170. <a href="/">link</a>
  171. </div>
  172. <div class="linkage">
  173. <a href="/">link</a>
  174. </div>
  175. <div class="linkage">
  176. <a href="/">link</a>
  177. </div>
  178. <div class="linkage">
  179. <a href="/">link</a>
  180. </div>
  181. <div class="linkage">
  182. <a href="/">link</a>
  183. </div>
  184. <div class="linkage">
  185. <a href="/">link</a>
  186. </div>
  187. <div class="linkage">
  188. <a href="/">link</a>
  189. </div>
  190. <div class="linkage">
  191. <a href="/">link</a>
  192. </div>
  193. <div class="linkage">
  194. <a href="/">link</a>
  195. </div>
  196. <div class="linkage">
  197. <a href="/">link</a>
  198. </div>
  199. <div class="linkage">
  200. <a href="/">link</a>
  201. </div>
  202.  
  203. </div>
  204.  
  205. </div>
  206.  
  207. <!--FIRST COLUMN ENDS-->
  208.  
  209.  
  210. <!--SECOND COLUMN STARTS-->
  211.  
  212. <div id="columnii">
  213.  
  214. <div id="columns">
  215.  
  216. <div class="titles">
  217. title
  218. </div>
  219.  
  220. <div class="linkage">
  221. <a href="/">link</a>
  222. </div>
  223. <div class="linkage">
  224. <a href="/">link</a>
  225. </div>
  226. <div class="linkage">
  227. <a href="/">link</a>
  228. </div>
  229. <div class="linkage">
  230. <a href="/">link</a>
  231. </div>
  232. <div class="linkage">
  233. <a href="/">link</a>
  234. </div>
  235. <div class="linkage">
  236. <a href="/">link</a>
  237. </div>
  238. <div class="linkage">
  239. <a href="/">link</a>
  240. </div>
  241. <div class="linkage">
  242. <a href="/">link</a>
  243. </div>
  244. <div class="linkage">
  245. <a href="/">link</a>
  246. </div>
  247. <div class="linkage">
  248. <a href="/">link</a>
  249. </div>
  250. <div class="linkage">
  251. <a href="/">link</a>
  252. </div>
  253. <div class="linkage">
  254. <a href="/">link</a>
  255. </div>
  256. <div class="linkage">
  257. <a href="/">link</a>
  258. </div>
  259. <div class="linkage">
  260. <a href="/">link</a>
  261. </div>
  262.  
  263. </div>
  264.  
  265. </div>
  266.  
  267. <!--SECOND COLUMN ENDS-->
  268.  
  269.  
  270. <!--THIRD COLUMN STARTS-->
  271.  
  272. <div id="columniii">
  273.  
  274. <div id="columns">
  275.  
  276. <div class="titles">
  277. title
  278. </div>
  279.  
  280. <div class="linkage">
  281. <a href="/">link</a>
  282. </div>
  283. <div class="linkage">
  284. <a href="/">link</a>
  285. </div>
  286. <div class="linkage">
  287. <a href="/">link</a>
  288. </div>
  289. <div class="linkage">
  290. <a href="/">link</a>
  291. </div>
  292. <div class="linkage">
  293. <a href="/">link</a>
  294. </div>
  295. <div class="linkage">
  296. <a href="/">link</a>
  297. </div>
  298. <div class="linkage">
  299. <a href="/">link</a>
  300. </div>
  301. <div class="linkage">
  302. <a href="/">link</a>
  303. </div>
  304. <div class="linkage">
  305. <a href="/">link</a>
  306. </div>
  307. <div class="linkage">
  308. <a href="/">link</a>
  309. </div>
  310. <div class="linkage">
  311. <a href="/">link</a>
  312. </div>
  313. <div class="linkage">
  314. <a href="/">link</a>
  315. </div>
  316. <div class="linkage">
  317. <a href="/">link</a>
  318. </div>
  319. <div class="linkage">
  320. <a href="/">link</a>
  321. </div>
  322.  
  323. </div>
  324.  
  325. </div>
  326.  
  327. <!--THIRD COLUMN ENDS-->
  328.  
  329.  
  330. <!--FOURTH COLUMN STARTS-->
  331.  
  332. <div id="columniv">
  333.  
  334. <div id="columns">
  335.  
  336. <div class="titles">
  337. title
  338. </div>
  339.  
  340. <div class="linkage">
  341. <a href="/">link</a>
  342. </div>
  343. <div class="linkage">
  344. <a href="/">link</a>
  345. </div>
  346. <div class="linkage">
  347. <a href="/">link</a>
  348. </div>
  349. <div class="linkage">
  350. <a href="/">link</a>
  351. </div>
  352. <div class="linkage">
  353. <a href="/">link</a>
  354. </div>
  355. <div class="linkage">
  356. <a href="/">link</a>
  357. </div>
  358. <div class="linkage">
  359. <a href="/">link</a>
  360. </div>
  361. <div class="linkage">
  362. <a href="/">link</a>
  363. </div>
  364. <div class="linkage">
  365. <a href="/">link</a>
  366. </div>
  367. <div class="linkage">
  368. <a href="/">link</a>
  369. </div>
  370. <div class="linkage">
  371. <a href="/">link</a>
  372. </div>
  373. <div class="linkage">
  374. <a href="/">link</a>
  375. </div>
  376. <div class="linkage">
  377. <a href="/">link</a>
  378. </div>
  379. <div class="linkage">
  380. <a href="/">link</a>
  381. </div>
  382.  
  383. </div>
  384.  
  385. </div>
  386.  
  387. <!--FOURTH COLUMN ENDS-->
  388.  
  389.  
  390. <!--CODE FOR THE TITLE-->
  391.  
  392. <center>
  393. <div id="title">
  394. Navigation Base
  395. </div>
  396. </center>
  397.  
  398. <!--CODE FOR MY CREDIT IF YOU KEEP IT. HOWEVER, YOU CAN REMOVE IT. YOU CAN USE THIS AS A BASE FOR YOUR OWN THEMES AND EVEN USE THE TEMPLATE I HAVE TO MAKE YOUR OWN CREDIT. REALLY, I DON'T CARE. BUT I'D LOVE YOU FOREVER IF YOU DID KEEP IT, IF YOU'RE NOT RELEASING IT.-->
  399.  
  400. <div style="position:fixed;bottom:2px; right:3px; font-size:9px; letter-spacing:1px; font-family:calibri; height: 15px; width: 20px; background-color:black; border:1px solid black; border-radius: 50%; padding-top: 5px; text-align: center"><a style="color:#fcfcfc; text-decoration:none;" href="http://stvcky.tumblr.com/">S</a></center></div>
  401.  
  402. </body>
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!