search.wxss 1.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104
  1. /*
  2. ========
  3. 搜索部分css
  4. ========
  5. */
  6. .hmly-search{
  7. width: 90%;
  8. height: auto;
  9. display: flex;
  10. align-items: center;
  11. margin: 0rpx auto;
  12. }
  13. .hmly-search-left{
  14. flex: 4;
  15. background-color: rgb(240, 240, 240);
  16. display: flex;
  17. justify-content: flex-start;
  18. align-items: center;
  19. padding: 10rpx 20rpx;
  20. border-radius: 15rpx;
  21. }
  22. .hmly-search input{
  23. width: 90%;
  24. height: 100%;
  25. font-size: 29rpx;
  26. margin-left: 20rpx;
  27. }
  28. .hmly-search-right{
  29. flex: 0.5;
  30. font-size:30rpx;
  31. color: #aaa;
  32. text-align: center;
  33. margin-left: 30rpx;
  34. }
  35. /*
  36. ========
  37. 搜索历史和热门搜索部分css
  38. ========
  39. */
  40. .hmly-title{
  41. width: 100%;
  42. height: 50rpx;
  43. display: flex;
  44. justify-content: space-between;
  45. align-items: center;
  46. box-sizing: border-box;
  47. }
  48. .hmly-title-text{
  49. color: #000;
  50. font-weight: 700;
  51. }
  52. .hmly-history{
  53. width: 90%;
  54. height: auto;
  55. margin: 0rpx auto;
  56. margin-top: 80rpx;
  57. }
  58. .hmly-history-content{
  59. width: 100%;
  60. height: auto;
  61. margin-top: 30rpx;
  62. display: flex;
  63. justify-content: space-between;
  64. flex-wrap: wrap;
  65. align-items: center;
  66. }
  67. .hmly-content-item{
  68. width: 150rpx;
  69. font-size: 33rpx;
  70. text-align: center;
  71. padding: 10rpx 20rpx;
  72. margin-bottom: 20rpx;
  73. border-radius: 25rpx;
  74. }
  75. .hmly-hot{
  76. width: 90%;
  77. height: auto;
  78. margin: 0rpx auto;
  79. margin-top: 80rpx;
  80. }
  81. .hmly-hot-content{
  82. width: 100%;
  83. height: auto;
  84. margin-top: 30rpx;
  85. }
  86. .hmly-hot-items{
  87. width: 100%;
  88. height: 50rpx;
  89. display: flex;
  90. justify-content: space-between;
  91. align-items: center;
  92. margin-bottom: 20rpx;
  93. }
  94. .hmly-item-left{
  95. display: flex;
  96. justify-content: flex-start;
  97. font-size: 32rpx;
  98. }
  99. .hmly-item-title{
  100. margin-left: 40rpx;
  101. }