Home Explore Project
Register Sign In
MiniStar
/
ximalaya-lite
4
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Tree: fa26b86aaa
Branches Tags
ximalaya-lite
/
pages
/
search
/
search.wxss

search.wxss 1.4 KB
History Raw

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495 
  1. /* 
    2. 

  2.   ======== 
    3. 

  3.   搜索部分css 
    4. 

  4.   ========
    5. 

  5. */
    6. 

  6. .search{
    7. 

  7.   width: 90%;
    8. 

  8.   height: auto;
    9. 

  9.   display: flex;
    10. 

  10.   align-items: center;
    11. 

  11.   margin: 0rpx auto;
    12. 

  12. }
    13. 

  13. 

  14. .search-left{
    15. 

  15.   flex: 4;
    16. 

  16.   background-color: rgb(240, 240, 240);
    17. 

  17.   display: flex;
    18. 

  18.   justify-content: flex-start;
    19. 

  19.   align-items: center;
    20. 

  20.   padding: 10rpx 20rpx;
    21. 

  21.   border-radius: 15rpx;
    22. 

  22. }
    23. 

  23. 

  24. .search input{
    25. 

  25.   width: 90%;
    26. 

  26.   height: 100%;
    27. 

  27.   font-size: 29rpx;
    28. 

  28.   margin-left: 20rpx;
    29. 

  29. }
    30. 

  30. .search-right{
    31. 

  31.   flex: 0.5;
    32. 

  32.   font-size:30rpx;
    33. 

  33.   color: #aaa;
    34. 

  34.   text-align: center;
    35. 

  35.   margin-left: 30rpx;
    36. 

  36. }
    37. 

  37. /* 
    38. 

  38.   ======== 
    39. 

  39.   搜索历史和热门搜索部分css 
    40. 

  40.   ========
    41. 

  41. */
    42. 

  42. 

  43. .history{
    44. 

  44.   width: 90%;
    45. 

  45.   height: auto;
    46. 

  46.   margin: 0rpx auto;
    47. 

  47.   margin-top: 80rpx;
    48. 

  48. }
    49. 

  49. .history-content{
    50. 

  50.   width: 100%;
    51. 

  51.   height: auto;
    52. 

  52.   margin-top: 30rpx;
    53. 

  53.   display: flex;
    54. 

  54.   justify-content: space-between;
    55. 

  55.   flex-wrap: wrap;
    56. 

  56.   align-items: center;
    57. 

  57. }
    58. 

  58. .content-item{
    59. 

  59.   width: 150rpx;
    60. 

  60.   font-size: 33rpx;
    61. 

  61.   text-align: center;
    62. 

  62.   padding: 10rpx 20rpx;
    63. 

  63.   margin-bottom: 20rpx;
    64. 

  64.   border-radius: 25rpx;
    65. 

  65.   color: #333;
    66. 

  66.   background-color: rgb(240, 240, 240);
    67. 

  67. }
    68. 

  68. 

  69. .hot{
    70. 

  70.   width: 90%;
    71. 

  71.   height: auto;
    72. 

  72.   margin: 0rpx auto;
    73. 

  73.   margin-top: 80rpx;
    74. 

  74. }
    75. 

  75. .hot-content{
    76. 

  76.   width: 100%;
    77. 

  77.   height: auto;
    78. 

  78.   margin-top: 30rpx;
    79. 

  79. }
    80. 

  80. .hot-items{
    81. 

  81.   width: 100%;
    82. 

  82.   height: 50rpx;
    83. 

  83.   display: flex;
    84. 

  84.   justify-content: space-between;
    85. 

  85.   align-items: center;
    86. 

  86.   margin-bottom: 20rpx;
    87. 

  87. }
    88. 

  88. .item-left{
    89. 

  89.   display: flex;
    90. 

  90.   justify-content: flex-start;
    91. 

  91.   font-size: 32rpx;
    92. 

  92. }
    93. 

  93. .itemTitle{
    94. 

  94.   margin-left: 40rpx;
    95. 

  95. }
    96.