index.ttss 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154
  1. page view {
  2. box-sizing: border-box;
  3. flex-shrink: 0;
  4. }
  5. page {
  6. font-family: PingFangSC-Regular, Roboto, Helvetica Neue, Helvetica, Tahoma,
  7. Arial, PingFang SC-Light, Microsoft YaHei;
  8. margin: 0;
  9. }
  10. button {
  11. margin: 0;
  12. padding: 0;
  13. border: 1px solid transparent;
  14. outline: none;
  15. background-color: transparent;
  16. }
  17. button:active {
  18. opacity: 0.6;
  19. }
  20. .flex-col {
  21. display: flex;
  22. flex-direction: column;
  23. }
  24. .flex-row {
  25. display: flex;
  26. flex-direction: row;
  27. }
  28. .flex-row-reverse {
  29. display: flex;
  30. flex-direction: row-reverse;
  31. }
  32. .bord{
  33. border: 1px solid red;
  34. }
  35. .justify-start {
  36. display: flex;
  37. justify-content: flex-start;
  38. }
  39. .justify-center {
  40. display: flex;
  41. justify-content: center;
  42. }
  43. .justify-end {
  44. display: flex;
  45. justify-content: flex-end;
  46. }
  47. .justify-evenly {
  48. display: flex;
  49. justify-content: space-evenly;
  50. }
  51. .justify-around {
  52. display: flex;
  53. justify-content: space-around;
  54. }
  55. .justify-between {
  56. display: flex;
  57. justify-content: space-between;
  58. }
  59. .align-start {
  60. display: flex;
  61. align-items: flex-start;
  62. }
  63. .align-center {
  64. display: flex;
  65. align-items: center;
  66. }
  67. .align-end {
  68. display: flex;
  69. align-items: flex-end;
  70. }
  71. .sticky {
  72. display: flex;
  73. position: -webkit-sticky;
  74. position: sticky;
  75. top: 0rpx;
  76. z-index: 99;
  77. }
  78. .bord{
  79. border: 1px solid red;
  80. }
  81. .orderView{
  82. padding: 10rpx 10rpx;
  83. }
  84. .orderImgView{
  85. width: 180rpx;
  86. height: 180rpx;
  87. border-radius: 5rpx;
  88. overflow: hidden;
  89. }
  90. .orderImg{
  91. width: 180rpx;
  92. height: 180rpx;
  93. }
  94. .orderTitle{
  95. width: 400rpx;
  96. padding-left: 10rpx;
  97. }
  98. .goodsName{
  99. height: 28rpx;
  100. line-height: 28rpx;
  101. font-size: 28rpx;
  102. display: -webkit-box;
  103. -webkit-box-orient: vertical;
  104. -webkit-line-clamp: 1;
  105. overflow: hidden;
  106. text-overflow: ellipsis;
  107. }
  108. .specification{
  109. margin-top: 10rpx;
  110. height: 105rpx;
  111. line-height: 35rpx;
  112. font-size: 26rpx;
  113. display: -webkit-box;
  114. -webkit-box-orient: vertical;
  115. -webkit-line-clamp: 3;
  116. overflow: hidden;
  117. text-overflow: ellipsis;
  118. }
  119. .label{
  120. margin-top: 10rpx;
  121. height: 35rpx;
  122. line-height: 35rpx;
  123. font-size: 20rpx;
  124. border: 1rpx solid orangered;
  125. padding: 5rpx 10rpx;
  126. border-radius: 20rpx;
  127. }
  128. .priceAndNumber{
  129. width: 150rpx;
  130. }
  131. .price{
  132. font-size: 28rpx;
  133. text-align: right;
  134. }
  135. .number{
  136. font-size: 23rpx;
  137. text-align: right;
  138. }
  139. .buttonView{
  140. padding: 20rpx 0;
  141. }
  142. .button{
  143. height: 60rpx;
  144. font-size: 28rpx;
  145. line-height: 60rpx;
  146. padding: 0 20rpx;
  147. border-radius: 30rpx;
  148. margin-left: 10rpx;
  149. border: 1px solid #999999;
  150. }