CSS   100
tabulous css
Guest on 8th March 2023 12:33:13 PM


  1.  
  2. a:active, a:focus {
  3. outline: expression(hideFocus='true');
  4. /*background-color:#000;*/
  5. }
  6. p {
  7. margin-bottom: 20px;
  8. }
  9.  
  10. #tabs, {
  11. width: 1000px;
  12. margin-left:auto;
  13. margin-right:auto;
  14. margin-bottom: 10px;
  15. background-color:#000;
  16.  
  17. }
  18. #tabs li {
  19. float: left;
  20. margin-right: 1px;
  21. background-color:EDEDEE;
  22. }
  23. #tabs li a{
  24. display: block;
  25. padding: 17px 30px;
  26. background: #EDEDEE;
  27. text-decoration: none;
  28. color: #333;
  29. font-weight:bold;
  30. }
  31. #tabs li a:hover {
  32. background: #EDEDEE;
  33. }
  34. #tabs_container {
  35. padding: 10px;
  36. overflow: hidden;
  37. position: relative;
  38. background: white;
  39. }
  40. #tabs_container div {
  41. margin-right: 40px;
  42. }
  43. .transition {
  44. -webkit-transition: all .3s ease-in-out;
  45. -moz-transition: all .3s ease-in-out;
  46. -o-transition: all .3s ease-in-out;
  47. -ms-transition: all .3s ease-in-out;
  48. transition: all .3s ease-in-out;
  49. -webkit-transition-delay: .3s;
  50. -moz-transition-delay: .3s;
  51. -o-transition-delay: .3s;
  52. -ms-transition-delay: .3s;
  53. transition-delay: .3s;
  54. }
  55. .make_transist {
  56. -webkit-transition: all .3s ease-in-out;
  57. -moz-transition: all .3s ease-in-out;
  58. -o-transition: all .3s ease-in-out;
  59. -ms-transition: all .3s ease-in-out;
  60. transition: all .3s ease-in-out;
  61. }
  62. .hidescale {
  63. -webkit-transform: scale(0.9);
  64. -moz-transform: scale(0.9);
  65. -o-transform: scale(0.9);
  66. -ms-transform: scale(0.9);
  67. transform: scale(0.9);
  68. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  69. filter: alpha(opacity=0);
  70. filter: alpha(opacity=0);
  71. opacity: 0;
  72. }
  73. .showscale {
  74. -webkit-transform: scale(1);
  75. -moz-transform: scale(1);
  76. -o-transform: scale(1);
  77. -ms-transform: scale(1);
  78. transform: scale(1);
  79. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  80. filter: alpha(opacity=100);
  81. opacity: 1;
  82. -webkit-transition-delay: .3s;
  83. -moz-transition-delay: .3s;
  84. -o-transition-delay: .3s;
  85. -ms-transition-delay: .3s;
  86. transition-delay: .3s;
  87. }
  88. .hideleft {
  89. -webkit-transform: translateX(-100%);
  90. -moz-transform: translateX(-100%);
  91. -o-transform: translateX(-100%);
  92. -ms-transform: translateX(-100%);
  93. transform: translateX(-100%);
  94. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  95. filter: alpha(opacity=0);
  96. opacity: 0;
  97. }
  98. .showleft {
  99. -webkit-transform: translateX(0px);
  100. -moz-transform: translateX(0px);
  101. -o-transform: translateX(0px);
  102. -ms-transform: translateX(0px);
  103. transform: translateX(0px);
  104. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  105. filter: alpha(opacity=100);
  106. opacity: 1;
  107. -webkit-transition-delay: .3s;
  108. -moz-transition-delay: .3s;
  109. -o-transition-delay: .3s;
  110. -ms-transition-delay: .3s;
  111. transition-delay: .3s;
  112. }
  113. .hidescaleup {
  114. -webkit-transform: scale(1.1);
  115. -moz-transform: scale(1.1);
  116. -o-transform: scale(1.1);
  117. -ms-transform: scale(1.1);
  118. transform: scale(1.1);
  119. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  120. filter: alpha(opacity=0);
  121. opacity: 0;
  122. }
  123. .showscaleup {
  124. -webkit-transform: scale(1);
  125. -moz-transform: scale(1);
  126. -o-transform: scale(1);
  127. -ms-transform: scale(1);
  128. transform: scale(1);
  129. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  130. filter: alpha(opacity=100);
  131. opacity: 1;
  132. -webkit-transition-delay: .3s;
  133. -moz-transition-delay: .3s;
  134. -o-transition-delay: .3s;
  135. -ms-transition-delay: .3s;
  136. transition-delay: .3s;
  137. }
  138. .hideflip {
  139. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  140. filter: alpha(opacity=0);
  141. opacity: 0;
  142. -webkit-transform: rotatey(-90deg) scale(1.1);
  143. -moz-transform: rotatey(-90deg) scale(1.1);
  144. -o-transform: rotatey(-90deg) scale(1.1);
  145. -ms-transform: rotatey(-90deg) scale(1.1);
  146. transform: rotatey(-90deg) scale(1.1);
  147. -webkit-transform-origin: 50% 50%;
  148. -moz-transform-origin: 50% 50%;
  149. -o-transform-origin: 50% 50%;
  150. -ms-transform-origin: 50% 50%;
  151. transform-origin: 50% 50%;
  152. }
  153. .showflip {
  154. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  155. filter: alpha(opacity=100);
  156. opacity: 1;
  157. -webkit-transition-delay: .3s;
  158. -moz-transition-delay: .3s;
  159. -o-transition-delay: .3s;
  160. -ms-transition-delay: .3s;
  161. transition-delay: .3s;
  162. -webkit-transform: rotatey(0deg) scale(1);
  163. -moz-transform: rotatey(0deg) scale(1);
  164. -o-transform: rotatey(0deg) scale(1);
  165. -ms-transform: rotatey(0deg) scale(1);
  166. transform: rotatey(0deg) scale(1);
  167. -webkit-transform-origin: 50% 50%;
  168. -moz-transform-origin: 50% 50%;
  169. -o-transform-origin: 50% 50%;
  170. -ms-transform-origin: 50% 50%;
  171. transform-origin: 50% 50%;
  172. }
  173. .tabulous_active {
  174. background: 9ACA41 !important;
  175. /*color: #000 !important;*/
  176. }
  177. .tabulousclear {
  178. display: block;
  179. clear: both;
  180. }
Raw Paste

Login or Register to edit or fork this paste. It's free.