goods.wxss 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933
  1. .container {
  2. margin-bottom: 100rpx;
  3. }
  4. .goodsimgs {
  5. width: 750rpx;
  6. height: 750rpx;
  7. }
  8. .goodsimgs image {
  9. width: 750rpx;
  10. height: 750rpx;
  11. }
  12. .imageClass{
  13. background-size:600rpx 600rpx;
  14. }
  15. .weui-cells{
  16. margin-top: 80rpx;
  17. text-align: left;
  18. }
  19. .weui-label{
  20. width: 5em;
  21. }
  22. .page-body-button {
  23. margin-bottom: 30rpx;
  24. }
  25. .service-policy {
  26. width: 750rpx;
  27. height: 73rpx;
  28. background: #f4f4f4;
  29. padding: 0 31.25rpx;
  30. display: flex;
  31. flex-flow: row nowrap;
  32. align-items: center;
  33. justify-content: space-between;
  34. }
  35. .service-policy .item {
  36. background: url(http://120.76.26.84:80/group1/M00/00/02/rBJEdVvr25eAGT4BAAAA2Yyhu9Q372.png) 0 center no-repeat;
  37. background-size: 10rpx;
  38. padding-left: 15rpx;
  39. display: flex;
  40. align-items: center;
  41. font-size: 25rpx;
  42. color: #666;
  43. }
  44. .goods-info {
  45. width: 750rpx;
  46. height: 210rpx;
  47. overflow: hidden;
  48. background: #fff;
  49. }
  50. .goods-info .c {
  51. display: block;
  52. width: 718.75rpx;
  53. /* height: 100%; */
  54. margin-left: 31.25rpx;
  55. padding: 38rpx 31.25rpx 38rpx 0;
  56. border-bottom: 1px solid #f4f4f4;
  57. }
  58. .goods-info .c text {
  59. display: block;
  60. /* width: 687.5rpx; */
  61. text-align: left;
  62. font-weight: bolder;
  63. }
  64. .goods-info .name {
  65. height: 41rpx;
  66. margin-bottom: 20rpx;
  67. font-size: 30rpx;
  68. line-height: 41rpx;
  69. margin-top: 10rpx;
  70. }
  71. .goods-info .desc {
  72. height: 43rpx;
  73. margin-bottom: 41rpx;
  74. font-size: 24rpx;
  75. line-height: 36rpx;
  76. color: #999;
  77. width: 200rpx;
  78. }
  79. .desc2{
  80. position:absolute;
  81. right:220rpx;
  82. top:910rpx;
  83. height: 43rpx;
  84. margin-bottom: 41rpx;
  85. font-size: 24rpx;
  86. line-height: 36rpx;
  87. color: #999;
  88. }
  89. .goods-info .goods-do {
  90. text-align:left;
  91. }
  92. .goods-info .goods-do .price {
  93. /* height: 35rpx; */
  94. font-size: 35rpx;
  95. line-height: 35rpx;
  96. color: #b4282d;
  97. display: inline;
  98. text-align: left;
  99. }
  100. .goods-info .goods-do .org-price {
  101. /* height: 25rpx; */
  102. font-size: 25rpx;
  103. line-height: 35rpx;
  104. color: #303030;
  105. display: inline;
  106. text-align: left;
  107. }
  108. .goods-info .brand {
  109. margin-top: 23rpx;
  110. min-height: 40rpx;
  111. text-align: center;
  112. }
  113. .goods-info .brand text {
  114. display: inline-block;
  115. width: auto;
  116. padding: 2px 30rpx 2px 10.5rpx;
  117. line-height: 35.5rpx;
  118. border: 1px solid #f48f18;
  119. font-size: 25rpx;
  120. color: #f48f18;
  121. border-radius: 4px;
  122. background: url(http://120.76.26.84:80/group1/M00/00/02/rBJEdVvr28mAes5qAAABHjRl7xw575.png) 95% center no-repeat;
  123. background-size: 10.75rpx 18.75rpx;
  124. }
  125. .section-nav {
  126. width: 750rpx;
  127. height: 108rpx;
  128. background: #fff;
  129. margin-bottom: 20rpx;
  130. }
  131. .section-nav .t {
  132. float: left;
  133. width: 600rpx;
  134. height: 108rpx;
  135. line-height: 108rpx;
  136. font-size: 29rpx;
  137. color: #333;
  138. margin-left: 31.25rpx;
  139. }
  140. .section-nav .i {
  141. float: right;
  142. width: 52rpx;
  143. height: 52rpx;
  144. margin-right: 16rpx;
  145. margin-top: 28rpx;
  146. }
  147. .section-act .t {
  148. float: left;
  149. display: flex;
  150. align-items: center;
  151. width: 600rpx;
  152. height: 108rpx;
  153. overflow: hidden;
  154. line-height: 108rpx;
  155. font-size: 29rpx;
  156. color: #999;
  157. margin-left: 31.25rpx;
  158. }
  159. .section-act .label {
  160. color: #999;
  161. }
  162. .section-act .tag {
  163. display: flex;
  164. align-items: center;
  165. padding: 0 10rpx;
  166. border-radius: 3px;
  167. height: 37rpx;
  168. width: auto;
  169. color: #f48f18;
  170. overflow: hidden;
  171. border: 1px solid #f48f18;
  172. font-size: 25rpx;
  173. margin: 0 10rpx;
  174. }
  175. .section-act .text {
  176. display: flex;
  177. align-items: center;
  178. height: 37rpx;
  179. width: auto;
  180. overflow: hidden;
  181. color: #f48f18;
  182. font-size: 29rpx;
  183. }
  184. .comments {
  185. width: 100%;
  186. height: auto;
  187. padding-left: 30rpx;
  188. background: #fff;
  189. margin: 20rpx 0;
  190. }
  191. .comments .h {
  192. height: 102.5rpx;
  193. line-height: 100.5rpx;
  194. width: 718.75rpx;
  195. padding-right: 16rpx;
  196. border-bottom: 1px solid #d9d9d9;
  197. }
  198. .comments .h .t {
  199. display: block;
  200. float: left;
  201. width: 50%;
  202. font-size: 38.5rpx;
  203. color: #333;
  204. }
  205. .comments .h .i {
  206. display: block;
  207. float: right;
  208. width: 164rpx;
  209. height: 100.5rpx;
  210. line-height: 100.5rpx;
  211. background: url(http://120.76.26.84:80/group1/M00/00/02/rBJEdVvr2_OAO7zoAAABG9E7g8o485.png) right center no-repeat;
  212. background-size: 52rpx;
  213. }
  214. .comments .b {
  215. height: auto;
  216. width: 720rpx;
  217. }
  218. .comments .item {
  219. height: auto;
  220. width: 720rpx;
  221. overflow: hidden;
  222. }
  223. .comments .info {
  224. height: 127rpx;
  225. width: 100%;
  226. padding: 33rpx 0 27rpx 0;
  227. }
  228. .comments .user {
  229. float: left;
  230. width: auto;
  231. height: 67rpx;
  232. line-height: 67rpx;
  233. font-size: 0;
  234. }
  235. .comments .user image {
  236. float: left;
  237. width: 67rpx;
  238. height: 67rpx;
  239. margin-right: 17rpx;
  240. border-radius: 50%;
  241. }
  242. .comments .user text {
  243. display: inline-block;
  244. width: auto;
  245. height: 66rpx;
  246. overflow: hidden;
  247. font-size: 29rpx;
  248. line-height: 66rpx;
  249. }
  250. .comments .time {
  251. display: block;
  252. float: right;
  253. width: auto;
  254. height: 67rpx;
  255. line-height: 67rpx;
  256. color: #7f7f7f;
  257. font-size: 25rpx;
  258. margin-right: 30rpx;
  259. }
  260. .comments .content {
  261. width: 720rpx;
  262. padding-right: 30rpx;
  263. line-height: 45.8rpx;
  264. font-size: 29rpx;
  265. margin-bottom: 24rpx;
  266. }
  267. .comments .imgs {
  268. width: 720rpx;
  269. height: auto;
  270. margin-bottom: 25rpx;
  271. }
  272. .comments .imgs .img {
  273. height: 150rpx;
  274. width: 150rpx;
  275. margin-right: 28rpx;
  276. }
  277. .comments .spec {
  278. width: 720rpx;
  279. padding-right: 30rpx;
  280. line-height: 30rpx;
  281. font-size: 24rpx;
  282. color: #999;
  283. margin-bottom: 30rpx;
  284. }
  285. .goods-attr {
  286. width: 750rpx;
  287. height: auto;
  288. overflow: hidden;
  289. padding: 0 31.25rpx 25rpx 31.25rpx;
  290. background: #fff;
  291. }
  292. .goods-attr .t {
  293. width: 687.5rpx;
  294. height: 104rpx;
  295. line-height: 104rpx;
  296. font-size: 38.5rpx;
  297. }
  298. .goods-attr .item {
  299. width: 687.5rpx;
  300. height: 68rpx;
  301. padding: 11rpx 20rpx;
  302. margin-bottom: 11rpx;
  303. background: #f7f7f7;
  304. font-size: 38.5rpx;
  305. }
  306. .goods-attr .left {
  307. float: left;
  308. font-size: 25rpx;
  309. width: 134rpx;
  310. height: 45rpx;
  311. line-height: 45rpx;
  312. overflow: hidden;
  313. color: #999;
  314. }
  315. .goods-attr .right {
  316. float: left;
  317. font-size: 26rpx;
  318. margin-left: 20rpx;
  319. width: 480rpx;
  320. height: 45rpx;
  321. line-height: 45rpx;
  322. overflow: hidden;
  323. color: #333;
  324. }
  325. .detail {
  326. width: 750rpx;
  327. height: auto;
  328. overflow: hidden;
  329. }
  330. .detail image {
  331. width: 750rpx;
  332. display: block;
  333. }
  334. .common-problem {
  335. width: 750rpx;
  336. height: auto;
  337. overflow: hidden;
  338. }
  339. .common-problem .h {
  340. position: relative;
  341. height: 145.5rpx;
  342. width: 750rpx;
  343. padding: 56.25rpx 0;
  344. background: #fff;
  345. text-align: center;
  346. }
  347. .common-problem .h .line {
  348. display: inline-block;
  349. position: absolute;
  350. top: 72rpx;
  351. left: 0;
  352. z-index: 2;
  353. height: 1px;
  354. margin-left: 225rpx;
  355. width: 300rpx;
  356. background: #ccc;
  357. }
  358. .common-problem .h .title {
  359. display: inline-block;
  360. position: absolute;
  361. top: 56.125rpx;
  362. left: 0;
  363. z-index: 3;
  364. height: 33rpx;
  365. margin-left: 285rpx;
  366. width: 180rpx;
  367. background: #fff;
  368. }
  369. .common-problem .b {
  370. width: 750rpx;
  371. height: auto;
  372. overflow: hidden;
  373. padding: 0rpx 30rpx;
  374. background: #fff;
  375. }
  376. .common-problem .item {
  377. height: auto;
  378. overflow: hidden;
  379. padding-bottom: 25rpx;
  380. }
  381. .common-problem .question-box .spot {
  382. float: left;
  383. display: block;
  384. height: 8rpx;
  385. width: 8rpx;
  386. background: #b4282d;
  387. border-radius: 50%;
  388. margin-top: 11rpx;
  389. }
  390. .common-problem .question-box .question {
  391. float: left;
  392. line-height: 30rpx;
  393. padding-left: 8rpx;
  394. display: block;
  395. font-size: 26rpx;
  396. padding-bottom: 15rpx;
  397. color: #303030;
  398. }
  399. .common-problem .answer {
  400. line-height: 36rpx;
  401. padding-left: 16rpx;
  402. font-size: 26rpx;
  403. color: #787878;
  404. }
  405. .related-goods {
  406. width: 750rpx;
  407. height: auto;
  408. overflow: hidden;
  409. }
  410. .related-goods .h {
  411. position: relative;
  412. height: 145.5rpx;
  413. width: 750rpx;
  414. padding: 56.25rpx 0;
  415. background: #fff;
  416. text-align: center;
  417. border-bottom: 1px solid #f4f4f4;
  418. }
  419. .related-goods .h .line {
  420. display: inline-block;
  421. position: absolute;
  422. top: 72rpx;
  423. left: 0;
  424. z-index: 2;
  425. height: 1px;
  426. margin-left: 225rpx;
  427. width: 300rpx;
  428. background: #ccc;
  429. }
  430. .related-goods .h .title {
  431. display: inline-block;
  432. position: absolute;
  433. top: 56.125rpx;
  434. left: 0;
  435. z-index: 3;
  436. height: 33rpx;
  437. margin-left: 285rpx;
  438. width: 180rpx;
  439. background: #fff;
  440. }
  441. .related-goods .b {
  442. width: 750rpx;
  443. height: auto;
  444. overflow: hidden;
  445. }
  446. .related-goods .b .item {
  447. float: left;
  448. background: #fff;
  449. width: 375rpx;
  450. height: auto;
  451. overflow: hidden;
  452. text-align: center;
  453. padding: 15rpx 31.25rpx;
  454. border-right: 1px solid #f4f4f4;
  455. border-bottom: 1px solid #f4f4f4;
  456. }
  457. .related-goods .item .img {
  458. width: 311.45rpx;
  459. height: 311.45rpx;
  460. background-size:211rpx 211rpx;
  461. }
  462. .related-goods .item .name {
  463. display: block;
  464. width: 311.45rpx;
  465. margin: 11.5rpx 0 15rpx 0;
  466. text-align: center;
  467. font-size: 30rpx;
  468. color: #333;
  469. }
  470. .related-goods .item .price {
  471. width: 311.45rpx;
  472. text-align: center;
  473. font-size: 30rpx;
  474. color: #b4282d;
  475. }
  476. .related-goods .item .price .cart{
  477. margin-left: 20rpx;
  478. width: 35rpx;
  479. height: 35rpx;
  480. vertical-align: -6rpx;
  481. }
  482. .bottom-btn {
  483. position: fixed;
  484. left: 0;
  485. bottom: 0;
  486. z-index: 10;
  487. width: 750rpx;
  488. height: 100rpx;
  489. display: flex;
  490. background: #fff;
  491. }
  492. .bottom-btn .l {
  493. float: left;
  494. height: 100rpx;
  495. width: 122rpx;
  496. border: 1px solid #f4f4f4;
  497. display: flex;
  498. align-items: center;
  499. justify-content: center;
  500. }
  501. .bottom-btn .l.l-home {
  502. border-right: none;
  503. border-left: none;
  504. text-align: center;
  505. }
  506. .bottom-btn .l.l-collect {
  507. border-right: none;
  508. border-left: none;
  509. text-align: center;
  510. }
  511. .bottom-btn .l.l-cart .box {
  512. position: relative;
  513. height: 60rpx;
  514. width: 60rpx;
  515. }
  516. .bottom-btn .l.l-cart .cart-count {
  517. height: 28rpx;
  518. width: 28rpx;
  519. z-index: 10;
  520. position: absolute;
  521. top: 0;
  522. right: 0;
  523. background: #b4282d;
  524. text-align: center;
  525. font-size: 18rpx;
  526. color: #fff;
  527. line-height: 28rpx;
  528. border-radius: 50%;
  529. }
  530. .bottom-btn .l.l-cart .icon {
  531. position: absolute;
  532. top: 10rpx;
  533. left: 0;
  534. }
  535. .bottom-btn .l .icon {
  536. display: block;
  537. height: 44rpx;
  538. width: 44rpx;
  539. }
  540. .bottom-btn .c {
  541. float: left;
  542. height: 100rpx;
  543. line-height: 96rpx;
  544. flex: 1;
  545. text-align: center;
  546. color: #333;
  547. border-top: 1px solid #f4f4f4;
  548. border-bottom: 1px solid #f4f4f4;
  549. }
  550. .bottom-btn .contact {
  551. float: left;
  552. height: 100rpx;
  553. width: 122rpx;
  554. border: 1px solid #f4f4f4;
  555. display: flex;
  556. align-items: center;
  557. justify-content: center;
  558. }
  559. .bottom-btn .r {
  560. border: 1px solid #b4282d;
  561. background: #b4282d;
  562. float: left;
  563. height: 100rpx;
  564. line-height: 96rpx;
  565. flex: 1;
  566. text-align: center;
  567. color: #fff;
  568. }
  569. @import "../../lib/wxParse/wxParse.wxss";
  570. .bottom-btn .r-disable {
  571. border: 1px solid #c57477;
  572. background: #c57477;
  573. float: left;
  574. height: 100rpx;
  575. line-height: 96rpx;
  576. flex: 1;
  577. text-align: center;
  578. color: rgb(248, 206, 206);
  579. }
  580. .attr-pop {
  581. width: 100%;
  582. height: auto;
  583. padding: 31.25rpx;
  584. background: #fff;
  585. position: fixed;
  586. bottom: 100rpx;
  587. z-index: 500;
  588. }
  589. .attr-close{
  590. float: right;
  591. width: 40rpx;
  592. height: 40rpx;
  593. line-height: 40rpx;
  594. border-radius: 50%;
  595. font-size: 40rpx;
  596. text-align: center;
  597. overflow: hidden;
  598. }
  599. .attr-pop .img-info {
  600. width: 687.5rpx;
  601. height: 177rpx;
  602. overflow: hidden;
  603. margin-bottom: 41.5rpx;
  604. }
  605. .attr-pop .img {
  606. float: left;
  607. height: 177rpx;
  608. width: 177rpx;
  609. background: #f4f4f4;
  610. margin-right: 31.25rpx;
  611. }
  612. .attr-pop .info {
  613. float: left;
  614. height: 177rpx;
  615. display: flex;
  616. align-items: center;
  617. }
  618. .attr-pop .p {
  619. font-size: 33rpx;
  620. color: #333;
  621. height: 33rpx;
  622. line-height: 33rpx;
  623. margin-bottom: 10rpx;
  624. }
  625. .attr-pop .a {
  626. font-size: 29rpx;
  627. color: #333;
  628. height: 40rpx;
  629. line-height: 40rpx;
  630. width: 260px;
  631. display:block;
  632. word-break: break-all;
  633. word-wrap: break-word;
  634. }
  635. .spec-con {
  636. width: 100%;
  637. height: auto;
  638. overflow: hidden;
  639. }
  640. .spec-con .name {
  641. height: 32rpx;
  642. margin-bottom: 22rpx;
  643. font-size: 29rpx;
  644. color: #333;
  645. }
  646. .spec-con .values {
  647. height: auto;
  648. margin-bottom: 31.25rpx;
  649. font-size: 0;
  650. }
  651. .spec-con .value {
  652. display: inline-block;
  653. height: 62rpx;
  654. padding: 0 35rpx;
  655. line-height: 56rpx;
  656. text-align: center;
  657. margin-right: 25rpx;
  658. margin-bottom: 16.5rpx;
  659. border: 1px solid #333;
  660. font-size: 25rpx;
  661. color: #333;
  662. }
  663. .spec-con .value.disable {
  664. border: 1px solid #ccc;
  665. color: #ccc;
  666. }
  667. .spec-con .value.selected {
  668. border: 1px solid #b4282d;
  669. color: #b4282d;
  670. }
  671. .number-item .selnum {
  672. width: 322rpx;
  673. height: 71rpx;
  674. border: 1px solid #ccc;
  675. display: flex;
  676. }
  677. .number-item .cut {
  678. width: 93.75rpx;
  679. height: 100%;
  680. text-align: center;
  681. line-height: 65rpx;
  682. }
  683. .number-item .number {
  684. flex: 1;
  685. height: 100%;
  686. text-align: center;
  687. line-height: 68.75rpx;
  688. border-left: 1px solid #ccc;
  689. border-right: 1px solid #ccc;
  690. float: left;
  691. }
  692. .number-item .add {
  693. width: 93.75rpx;
  694. height: 100%;
  695. text-align: center;
  696. line-height: 65rpx;
  697. }
  698. .number-item .addEnabel {
  699. width: 93.75rpx;
  700. height: 100%;
  701. text-align: center;
  702. line-height: 65rpx;
  703. color: #ccc;
  704. }
  705. .line-through {
  706. text-decoration: line-through;
  707. }
  708. .crash-goods {
  709. width: 750rpx;
  710. height: auto;
  711. overflow: hidden;
  712. }
  713. .crash-goods .h {
  714. position: relative;
  715. height: 145.5rpx;
  716. width: 750rpx;
  717. padding: 56.25rpx 0;
  718. background: #fff;
  719. text-align: center;
  720. border-bottom: 1px solid #f4f4f4;
  721. }
  722. .crash-goods .h .line {
  723. display: inline-block;
  724. position: absolute;
  725. top: 72rpx;
  726. left: 0;
  727. z-index: 2;
  728. height: 1px;
  729. margin-left: 225rpx;
  730. width: 300rpx;
  731. background: #ccc;
  732. }
  733. .crash-goods .h .title {
  734. display: inline-block;
  735. position: absolute;
  736. top: 56.125rpx;
  737. left: 0;
  738. z-index: 3;
  739. height: 33rpx;
  740. margin-left: 285rpx;
  741. width: 180rpx;
  742. background: #fff;
  743. }
  744. .crash-goods .b {
  745. width: 750rpx;
  746. height: auto;
  747. overflow: hidden;
  748. }
  749. .crash-goods .b .item {
  750. float: left;
  751. background: #fff;
  752. width: 375rpx;
  753. height: auto;
  754. overflow: hidden;
  755. text-align: center;
  756. padding: 15rpx 31.25rpx;
  757. border-right: 1px solid #f4f4f4;
  758. border-bottom: 1px solid #f4f4f4;
  759. }
  760. .crash-goods .item .img {
  761. width: 311.45rpx;
  762. height: 311.45rpx;
  763. }
  764. .crash-goods .item .name {
  765. display: block;
  766. width: 311.45rpx;
  767. height: 35rpx;
  768. margin: 11.5rpx 0 15rpx 0;
  769. text-align: center;
  770. overflow: hidden;
  771. font-size: 30rpx;
  772. color: #333;
  773. }
  774. .crash-goods .item .goods-do {
  775. text-align:left;
  776. }
  777. .crash-goods .item .goods-do .price {
  778. /* display: block; */
  779. /* width: 70.45rpx; */
  780. /* height: 30rpx; */
  781. text-align: left;
  782. font-size: 30rpx;
  783. color: #b4282d;
  784. display: inline;
  785. }
  786. .crash-goods .item .goods-do .org-price {
  787. /* display: block; */
  788. /* width: 70.45rpx; */
  789. /* height: 23rpx; */
  790. text-align: left;
  791. font-size: 30rpx;
  792. color: #303030;
  793. display: inline;
  794. }
  795. .crash-goods .item .goods-do .add {
  796. /* width: 93.75rpx; */
  797. /* height: 100%; */
  798. text-align: right;
  799. line-height: 65rpx;
  800. display: inline;
  801. }
  802. .shelves-view {
  803. position: fixed;
  804. left: 0;
  805. bottom: 100rpx;
  806. z-index: 10;
  807. width: 100%;
  808. height: 60rpx;
  809. display: flex;
  810. background: #fff;
  811. }
  812. .shelves-view .shelves {
  813. border: 1px solid #7c7b7b;
  814. background: #7c7b7b;
  815. float: left;
  816. height: 60rpx;
  817. line-height: 60rpx;
  818. flex: 1;
  819. text-align: center;
  820. color: #fff;
  821. width: 100%;
  822. }
  823. .shelves-view .shelves .shelves-text {
  824. font-size: 28rpx;
  825. flex: 1;
  826. text-align: center;
  827. color: #fff;
  828. }