slider.css 1.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
  1. .slider-disabled {
  2. opacity: 0.5;
  3. filter: alpha(opacity=50);
  4. }
  5. .slider-h {
  6. height: 22px;
  7. }
  8. .slider-v {
  9. width: 22px;
  10. }
  11. .slider-inner {
  12. position: relative;
  13. height: 6px;
  14. top: 7px;
  15. border-width: 1px;
  16. border-style: solid;
  17. border-radius: 5px;
  18. }
  19. .slider-handle {
  20. position: absolute;
  21. display: block;
  22. outline: none;
  23. width: 20px;
  24. height: 20px;
  25. top: 50%;
  26. margin-top: -10px;
  27. margin-left: -10px;
  28. }
  29. .slider-tip {
  30. position: absolute;
  31. display: inline-block;
  32. line-height: 12px;
  33. font-size: 12px;
  34. white-space: nowrap;
  35. top: -22px;
  36. }
  37. .slider-rule {
  38. position: relative;
  39. top: 15px;
  40. }
  41. .slider-rule span {
  42. position: absolute;
  43. display: inline-block;
  44. font-size: 0;
  45. height: 5px;
  46. border-width: 0 0 0 1px;
  47. border-style: solid;
  48. }
  49. .slider-rulelabel {
  50. position: relative;
  51. top: 20px;
  52. }
  53. .slider-rulelabel span {
  54. position: absolute;
  55. display: inline-block;
  56. font-size: 12px;
  57. }
  58. .slider-v .slider-inner {
  59. width: 6px;
  60. left: 7px;
  61. top: 0;
  62. float: left;
  63. }
  64. .slider-v .slider-handle {
  65. left: 50%;
  66. margin-top: -10px;
  67. }
  68. .slider-v .slider-tip {
  69. left: -10px;
  70. margin-top: -6px;
  71. }
  72. .slider-v .slider-rule {
  73. float: left;
  74. top: 0;
  75. left: 16px;
  76. }
  77. .slider-v .slider-rule span {
  78. width: 5px;
  79. height: 'auto';
  80. border-left: 0;
  81. border-width: 1px 0 0 0;
  82. border-style: solid;
  83. }
  84. .slider-v .slider-rulelabel {
  85. float: left;
  86. top: 0;
  87. left: 23px;
  88. }
  89. .slider-handle {
  90. background: url('images/slider_handle.png') no-repeat;
  91. }
  92. .slider-inner {
  93. border-color: #D4D4D4;
  94. background: #F2F2F2;
  95. }
  96. .slider-rule span {
  97. border-color: #D4D4D4;
  98. }
  99. .slider-rulelabel span {
  100. color: #333;
  101. }