Home Explore Help
Sign In
fuyu
/
tjshop
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Tree: 24f49b29b3
Branches Tags
tjshop
/
shop
/
static
/
style
/
shop.css

shop.css 9.0 KB
History Raw

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153 
  1. /*
    2. 

  2. 用户中心页面样式
    3. 

  3. By:Jayson
    4. 

  4. */
    5. 

  5. 

  6. 

  7. /*首页*/
    8. 

  8. /*焦点图*/
    9. 

  9. .focus{ width:2000px; height:550px; margin:auto; background-color:#FFF; }
    10. 

  10. .index-fast{ text-align:justify; text-align-last:justify; height:202px; }
    11. 

  11. @media all and (-webkit-min-device-pixel-ratio:0){
    12. 

  12. .index-fast{ font-size:0; }
    13. 

  13. }
    14. 

  14. .index-fast:after{ display:inline-block; overflow:hidden; width:100%; height:0; content:''; }
    15. 

  15. .index-fast a{ width:24%; display:inline-block; font-size:15px; text-align-last:initial; height:200px; color:#000; border:1px solid #DDD; border-radius:3px; }
    16. 

  16. 

  17. 

  18. /*商城导航*/
    19. 

  19. .s-subnav{ width:180px; margin-right:18px; float:left; border-left:1px solid #EEE; border-bottom:1px solid #EEE; border-right:1px solid #EEE; border-top:1px solid #0ACAFE; box-shadow:1px 1px 1px #FCFCFC; }
    20. 

  20. .s-subnav dt, .s-subnav dd{ height:40px; line-height:40px; padding:0 15px; font-size:14px; border-bottom:1px solid #EEE; }
    21. 

  21. .s-subnav dt{ box-shadow:0 1px 1px #F3F3F3; font-weight:bold; color:#0ACAFE; }
    22. 

  22. .s-subnav dd a{ padding-left:14px; position:relative; line-height:40px; color:#666; background:url(s-subnav-icon.png) no-repeat center left; }
    23. 

  23. .s-subnav dd a:hover{ color:#0ACAFE; }
    24. 

  24. .s-subnav dd .cur{ color:#0ACAFE; }
    25. 

  25. .s-subnav dd .hot{ width:71px; height:16px; position:absolute; right:-72px; top:-8px; background:url(s-subnav-tips1.png) no-repeat; }
    26. 

  26. 

  27. /*列表*/
    28. 

  28. .s-list-box{ margin-left:200px; }
    29. 

  29. /*商城筛选*/
    30. 

  30. .opt{ height:40px; display:block; border:1px solid #EEE; box-shadow:1px 1px 1px #FCFCFC; }
    31. 

  31. .opt dt{ padding:0 10px; float:left; }
    32. 

  32. .opt dt a{ line-height:40px; font-size:14px; color:#333; }
    33. 

  33. .opt dt .cur{ color:#0ACAFE; }
    34. 

  34. .opt dt .up, .opt dt .down{ width:9px; height:12px; display:inline-block; margin-left:4px; }
    35. 

  35. .opt dt .up{ background:url(up.png) no-repeat; }
    36. 

  36. .opt dt .down{ background:url(down.png) no-repeat; }
    37. 

  37. .opt span{ float:left; font-size:14px; line-height:38px; color:#EEE; }
    38. 

  38. /*列表部分*/
    39. 

  39. .s-list{ width:760px; }
    40. 

  40. .s-list ul{ width:760px; }
    41. 

  41. .s-list ul li{ margin:20px 16px 20px; }
    42. 

  42. @media screen and (min-width:1200px){
    43. 

  43. 	.s-list{ width:920px; }
    44. 

  44. 	.s-list ul{ width:936px; }
    45. 

  45. 	.s-list ul li{ margin:20px 16px 20px 0; }
    46. 

  46. }
    47. 

  47. @media screen and (max-width:1200px){
    48. 

  48. 	.s-list{ width:760px; }
    49. 

  49. 	.s-list ul{ width:760px; }
    50. 

  50. 	.s-list ul li{ margin:20px 16px 20px; }
    51. 

  51. }
    52. 

  52. .s-list ul li{ width:210px; padding:4px 4px 4px; float:left; }
    53. 

  53. .s-list ul li:hover{ box-shadow:0 0 2px #DDD; }
    54. 

  54. .s-list ul li img{ width:210px; height:168px; margin-bottom:10px; }
    55. 

  55. .s-list ul li h3, .s-list ul li h6, .s-list ul li .price, .s-list ul li .add-cart{ padding:3px 3px; font-weight:normal; width:204px; }
    56. 

  56. .s-list ul li h3{ font-size:16px; color:#333; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    57. 

  57. .s-list ul li h6{ height:32px; line-height:150%; font-size:12px; color:#A3AAB6; overflow:hidden; }
    58. 

  58. .s-list ul li .price i{ font-size:13px; color:#FF771F; font-style:normal; font-family:"Helvetica"; margin-right:3px; }
    59. 

  59. .s-list ul li .price strong{ font-size:17px; color:#FF771F; font-weight:normal; }
    60. 

  60. .s-list ul li .price span{ font-size:12px; color:#999; margin-left:10px; text-decoration:line-through; }
    61. 

  61. .s-list ul li .add-cart button{ width:90px; height:28px; line-height:26px; background-color:#F9F9F9; border:1px solid #F3F3F3; border-radius:2px; color:#0BC1E9; cursor:pointer; font-size:12px; }
    62. 

  62. .s-list ul li .add-cart span{ line-height:30px; font-size:12px; float:right; color:#CCC; }
    63. 

  63. 

  64. /*详情*/
    65. 

  65. .re-look{ display:none; }
    66. 

  66. @media screen and (min-width:1200px) { 
    67. 

  67. 	.re-look{ display:block; }
    68. 

  68. }
    69. 

  69. /*商品参数*/
    70. 

  70. .bdsharebuttonbox a{ color:#999; }
    71. 

  71. .s-view{ width:580px; }
    72. 

  72. .s-view h6{ font-weight:normal; }
    73. 

  73. .s-view dl{ clear:both; padding:8px 0; overflow:hidden; }
    74. 

  74. .s-view dt{ width:50px; float:left; line-height:32px; padding-left:10px; font-size:12px; color:#999; }
    75. 

  75. .s-view dd{ float:left; line-height:32px; }
    76. 

  76. .s-view .price{ width:100%; height:90px; margin-top:15px; background-color:#F9F9F9; }
    77. 

  77. .s-view .price dl{ padding:5px 0; }
    78. 

  78. .s-view .price i{ font-style:normal; font-family:Helvetica; }
    79. 

  79. .s-view .buy, .s-view .add-card{ width:160px; height:36px; font-size:14px; border:1px solid #FF771F; cursor:pointer; border-radius:3px; }
    80. 

  80. .s-view .buy{ background-color:#FFF9F5; color:#FF771F; }
    81. 

  81. .s-view .add-card{ background-color:#FF771F; color:#FFF; }
    82. 

  82. .s-view .alipay, .s-view .wxpay, .s-view .visa{ margin-left:10px; padding-left:20px; height:16px; display:inline-block; line-height:16px; color:#999; font-size:12px; }
    83. 

  83. .s-view .alipay{ background:url(alipay.png) no-repeat; }
    84. 

  84. .s-view .wxpay{ background:url(wxpay.png) no-repeat; }
    85. 

  85. .s-view .visa{ background:url(visa.png) no-repeat; }
    86. 

  86. .s-view .promise span{ float:left; font-size:14px; color:#DDD; margin:0 15px; }
    87. 

  87. .chaoshitui, .suishitui, .zhuanye{ height:32px; float:left; padding-left:25px; color:#CCC; line-height:32px; font-size:14px; }
    88. 

  88. .chaoshitui{ background:url(chaoshitui.png) no-repeat left center; }
    89. 

  89. .suishitui{ background:url(suishitui.png) no-repeat left center; }
    90. 

  90. .zhuanye{ background:url(zhuanyefuwu.png) no-repeat left center; }
    91. 

  91. /*看了又看*/
    92. 

  92. .re-look{ width:140px; }
    93. 

  93. .re-look dt{ height:24px; background:url(EEE_dot.png) repeat-x center; text-align:center; }
    94. 

  94. .re-look dt span{ line-height:24px; font-size:12px; color:#999; padding:0 5px; background-color:#FFF; }
    95. 

  95. .re-look dd{ width:140px; height:140px; margin:5px 0; overflow:hidden; display:inline-block; position:relative; }
    96. 

  96. .re-look dd img{ width:140px; vertical-align:middle; }
    97. 

  97. .re-look dd span{ position:absolute; left:0; bottom:0; background-color:rgba(255,255,255,.5); color:#000; text-align:center; font-size:12px; width:140px; height:20px; line-height:20px; }
    98. 

  98. 

  99. /*在线客服*/
    100. 

  100. .kefu-btn{ width:200px; background-color:#CCC; }
    101. 

  101. .s-v-fl{ width:180px; margin-top:20px; display:block; padding:0 9px; border:1px solid #EEE; }
    102. 

  102. .s-v-fl dt{ font-size:16px; color:#333; padding:15px 0; }
    103. 

  103. .s-v-fl dd{ border-top:1px dotted #EEE; padding-left:10px; background:url(DDDx3_dot.png) no-repeat center left; height:38px; line-height:38px; }
    104. 

  104. .s-v-fl dd a{ font-size:12px; color:#333; }
    105. 

  105. 

  106. /*商品介绍*/
    107. 

  107. .s-tab{ border:1px solid #EEE; height:46px; }
    108. 

  108. .s-tab li{ height:46px; padding:0 20px; float:left; line-height:46px; font-size:12px; color:#666; border-top:2px solid #FFF; cursor:pointer; }
    109. 

  109. .s-tab .cli{ margin-top:-1px; border-top:2px solid #0DC6E4; color:#0DC6E4; }
    110. 

  110. .s-con{ width:740px; margin-top:20px; overflow:hidden; }
    111. 

  111. .v-title{ text-align:center; margin-top:30px; margin-bottom:20px; }
    112. 

  112. .v-title span{ padding:3px 15px; background-color:#EEE; color:#AAA; margin:auto; font-size:1rem; border-radius:2px; }
    113. 

  113. .v-syrq{ width:100%; }
    114. 

  114. .v-syrq td{ border:none; text-align:center; }
    115. 

  115. .v-syrq td img{ width:100px; height:100px; }
    116. 

  116. .v-syrq td p{ font-size:14px; color:#333; margin-top:10px; }
    117. 

  117. .v-view{ margin:10px 0; }
    118. 

  118. .v-view h3{ width:100%; text-align:center; font-size:16px; color:#999; }
    119. 

  119. .v-view table{ width:100%; border:none; margin-top:10px; margin-bottom:20px; }
    120. 

  120. .v-view td{ height:30px; vertical-align:middle; border:1px solid #F6F6F6; padding:5px 10px; font-size:.8rem; }
    121. 

  121. .v-tips{ font-size:14px; color:#666; line-height:160%; padding:10px; border:1px solid #F6F6F6; }
    122. 

  122. 

  123. 

  124. /*购物车*/
    125. 

  125. .cart-list td{ vertical-align:middle; padding:10px 5px; border-bottom:1px solid #EEE; }
    126. 

  126. .cart-list td input{ vertical-align:middle; }
    127. 

  127. .cart-list-total{ padding-left:5px; height:50px; }
    128. 

  128. .cart-list-total .l{ line-height:50px; }
    129. 

  129. .cart-list-total input{ vertical-align:middle; margin-right:5px; }
    130. 

  130. .cart-list-total button{ width:160px; height:50px; background-color:#FE6B00; color:#FFF; border:none; font-size:16px; cursor:pointer; }
    131. 

  131. 

  132. /*订单详情*/
    133. 

  133. .d-view{}
    134. 

  134. .d-view .btn{ width:130px; height:32px; margin-top:15px; cursor:pointer; color:#FFF; background-color:#FF0000; border:none; }
    135. 

  135. .d-view .o-rdo{ height:32px; line-height:32px; width:130px; }
    136. 

  136. .d-view .fp-view{ border:1px dotted #DDD; border-radius:3px; padding:10px; overflow:hidden; margin-top:20px; }
    137. 

  137. .d-view .fp-view h3{ font-size:14px; color:#1BBCD5; }
    138. 

  138. .d-view .fp-view dl{ clear:both; overflow:hidden; margin-top:10px; }
    139. 

  139. .d-view .fp-view dt{ width:150px; line-height:30px; float:left; font-size:12px; color:#666; text-align:right; }
    140. 

  140. .d-view .fp-view dd{ float:left; line-height:30px; font-size:12px; color:#666; }
    141. 

  141. .d-view .fp-view dd .txt{ width:300px; height:28px; font-size:14px; color:#000; padding:0 3px; border:1px solid #CCC; border-radius:2px; }
    142. 

  142. .d-view .alzf, .d-view .wxzf, .d-view .wyzf{ width:150px; height:40px; }
    143. 

  143. .d-view .alzf{ background:url(d-view-alipay.jpg) no-repeat; }
    144. 

  144. .d-view .wxzf{ background:url(d-view-wxpay.jpg) no-repeat; }
    145. 

  145. .d-view .wyzf{ background:url(d-view-wypay.jpg) no-repeat; }
    146. 

  146. .d-view-list{}
    147. 

  147. .d-view-list dl{ margin-top:20px; }
    148. 

  148. .d-view-list dt{ width:90%; line-height:30px; font-size:12px; text-align:right; float:left; }
    149. 

  149. .d-view-list dd{ width:10%; line-height:30px; font-size:12px; text-align:right; float:left; }
    150. 

  150. .d-view-list button{ float:right; width:160px; height:50px; background-color:#FE6B00; cursor:pointer; color:#FFF; border:none; font-size:20px; }
    151. 

  151. .d-view-list em{ font-style:normal; }
    152. 

  152. .d-view-list span{ line-height:50px; font-size:20px; margin-right:20px; float:right; }
    153. 

  153. .d-view-list strong{ color:#FE6B00; }
    154.