SHARE
TWEET

TAB CODES

a guest May 23rd, 2019 84 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <style>
  2. #navi {
  3. bottom: 470px;
  4. right: 440px;
  5. vertical-align: center;
  6. text-align: center;
  7. position: absolute;
  8. letter-spacing: 10px;
  9. line-height: 5px;
  10. padding: 5px;
  11. margin: px;
  12. opacity:.8;
  13. }
  14.  
  15.  
  16. #navi a {
  17. padding: 10px;
  18. height:10;
  19. width: 90px;
  20. font-family: tinytots;
  21. font-size: 8px;
  22. text-transform:uppercase;
  23. letter-spacing: 3px;
  24. float: left;
  25. text-align: center;
  26. color:#999;
  27. background-color: lightgray;
  28. -webkit-transition: all 1s ease-in-out;
  29. -moz-transition: all 1s ease-in-out;
  30. -o-transition: all 1s ease-in-out;
  31. -ms-transition: all 1s ease-in-out;
  32. transition: all 1s ease-in-out;
  33. border: 1px solid #CDBBC9;
  34. }
  35.  
  36.  
  37. #navi a:hover {
  38. background-color: #CDBBC9;
  39. color: #999;
  40. -webkit-transition: all 1s ease-in-out;
  41. -moz-transition: all 1s ease-in-out;
  42. -o-transition: all 1s ease-in-out;
  43. -ms-transition: all 1s ease-in-out;
  44. transition: all 1s ease-in-out;
  45. border: 1px solid lightgray;
  46. }
  47.  
  48. </style>
  49.  
  50. <div id="navi">
  51. <a href="#one"></a>
  52.  
  53. <a href="#two"></a>
  54.  
  55. <a href="#three"></a>
  56.  
  57. <a href="#four"></a>
  58.  
  59. <a href="#five"></a>
  60. </div>
  61.  
  62. <a name="one"></a>
  63. <a name="two"></a>
  64. <a name="three"></a>
  65. <a name="four"></a>
  66. <a name="five"></a>
  67.  
  68.  
  69.  
  70. <style>
  71. This one is html only. This one to me is more complex.
  72. </style>
  73. -Style the background-
  74. <div style="background: #; margin-top: -250px; margin-left: 650px; float: left; font-size: 12px; letter-spacing: 1px;">
  75.  
  76. -Designing Individual Tabs-
  77. <a href="#1" style="text-decoration: none; color: #414954;"><div style="width: 105px; height: 105px; background: #000; border: 1px solid #EA0223; float:left; margin-top: 300px; margin-left:-240px; padding-top:px; border-radius: ;"><img src="https://78.media.tumblr.com/4cfd2d98c7fc1a66fd217cd05325238c/tumblr_oxo3ro54Hk1utd96do4_250.png" width="105"></div></a>
  78.  
  79. <a href="#2" style="text-decoration: none; color: #414954;"><div style="width: 105px; height: 104px; background: #000; border: 1px solid #EA0223; float: left; margin-top: 422px; margin-left: -240px; padding-top: px; border-radius: ;"><img src="https://78.media.tumblr.com/129945009d99499cab80263c5a48282e/tumblr_oxo3ro54Hk1utd96do2_250.png" width="105"></div></a>
  80.  
  81. <a href="#3" style="text-decoration: none; color: #414954;"><div style="width: 105px; height: 105px; background: #000; border: 1px solid #EA0223; float: left; margin-top: 548px; margin-left: -240px; padding-top: px; border-radius: ;"><img src="https://78.media.tumblr.com/6e50785633a48efdebcd589dbbec8724/tumblr_oxo3ro54Hk1utd96do7_250.png" width="105"></div></a>
  82.  
  83. <a href="#4" style="text-decoration: none; color: #414954;"><div style="width: 105px; height: 104px; background: #000; border: 1px solid #EA0223; float: left; margin-top: 668px; margin-left: -240px; padding-top: px; border-radius: ;"><img src="https://78.media.tumblr.com/4780f02363db5bbf038b8afc09b97696/tumblr_oxo3ro54Hk1utd96do8_250.png" width="105"></div></a>
  84.  
  85. -The box for the tabs to be connected yo-
  86. <div style="width: 490px; height: 240px; border: 2px solid #EA0223; margin-left: 174px; margin-right: 7px; margin-top: 540px; padding-left:20px; padding-top:5px; float: left; background-color: #fff; border-radius: ; overflow: hidden;"><div style="width: 475px; height: 300px; overflow: hidden; text-align: justify; font-size: 12px; font-variant: small-caps;">
  87.  
  88.  
  89. <a name="1"><a>
  90. <a name="2"><a>
  91. <a name="3"><a>
  92. <a name="4"><a>
  93.  
  94. <div>
RAW Paste Data
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!
 
Top