index.less 1.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. //css样式
  2. .select_box{
  3. width:45%;
  4. height:70%;
  5. border-radius: 14rpx;
  6. position: relative;
  7. }
  8. .select_box .select{
  9. box-sizing: border-box;
  10. width: 100%;
  11. height: 100%;
  12. border-radius: 8rpx;
  13. display: flex;
  14. align-items: center;
  15. padding: 0 10rpx;
  16. }
  17. .select_box .select .select_text{
  18. font-size: 26rpx;
  19. color: #777777;
  20. line-height: 28rpx;
  21. flex: 1;
  22. }
  23. .select_box .select .select_img{
  24. width: 30rpx;
  25. height: 30rpx;
  26. display: block;
  27. transition:transform 0.3s;
  28. }
  29. .select_box .select .select_img_rotate{
  30. transform:rotate(180deg);
  31. }
  32. .select_box .option_box{
  33. position: absolute;
  34. top: calc(100% - 1px);
  35. width: 100%;
  36. box-sizing: border-box;
  37. height: 0;
  38. overflow-y: auto;
  39. background: #fff;
  40. transition: height 0.3s;
  41. border-left:1px solid #efefef;
  42. border-right:1px solid #efefef;
  43. }
  44. .select_box .option_box .option{
  45. display: block;
  46. line-height: 30rpx;
  47. font-size: 26rpx;
  48. border-top: 1px solid #efefef;
  49. border-bottom: 1px solid #efefef;
  50. padding: 10rpx;
  51. }