index.less 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. .tab-view {
  2. position: sticky;
  3. top: 0;
  4. z-index: 999;
  5. }
  6. .cers {
  7. display: flex;
  8. flex-wrap: wrap;
  9. margin-top: 15px;
  10. align-items: center;
  11. width: 100%;
  12. button {
  13. width: 17%;
  14. font-size: 13px;
  15. margin-bottom: 10px;
  16. }
  17. /* 选中时添加这个 样式 */
  18. .active {
  19. background: #dae9fd;
  20. }
  21. /* 三角形 */
  22. .active::before {
  23. content: '';
  24. display: inline-block;
  25. position: absolute;
  26. right: 0;
  27. bottom: 0;
  28. width: 0;
  29. height: 0;
  30. border-bottom: 15px solid rebeccapurple;
  31. border-left: 14px solid transparent;
  32. }
  33. }
  34. .container {
  35. display: flex;
  36. flex-direction: column;
  37. justify-content: flex-start;
  38. align-items: center;
  39. align-content: center;
  40. width: 100%;
  41. .input-view {
  42. margin: 20px 0px;
  43. width: 100%;
  44. display: flex;
  45. flex-direction: column;
  46. align-items: center;
  47. align-content: center;
  48. margin-bottom: 10px;
  49. .field-view {
  50. width: 95%;
  51. }
  52. .label {
  53. width: 100%;
  54. text-align: center;
  55. font-size: 15px;
  56. color: #333;
  57. height: 35px;
  58. margin-top: 10px;
  59. }
  60. }
  61. }
  62. .button-view {
  63. display: flex;
  64. justify-content: space-between;
  65. margin: 10px 10px 10px 10px;
  66. van-button {
  67. width: 48%;
  68. height: 40px;
  69. }
  70. }