freelayout.wxml 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455
  1. <view class="container page" data-weui-theme="{{theme}}">
  2. <view class="flexbox">
  3. <mp-row>
  4. <mp-col xs="{{24}}" span="{{0}}">
  5. <view>
  6. <view class="item item-A">
  7. A
  8. </view>
  9. </view>
  10. </mp-col>
  11. <mp-col xs="{{24}}" span="{{0}}">
  12. <view>
  13. <view class="item item-B">
  14. B
  15. </view>
  16. </view>
  17. </mp-col>
  18. <mp-col xs="{{24}}" span="{{0}}">
  19. <view>
  20. <view class="{{theme === 'dark' ? 'item dark-C' : 'item item-C'}}">
  21. C
  22. </view>
  23. </view>
  24. </mp-col>
  25. </mp-row>
  26. <!-- 宽屏左右布局 -->
  27. <mp-row>
  28. <mp-col xs="{{0}}" span="{{16}}">
  29. <mp-row>
  30. <mp-col>
  31. <view>
  32. <view class="item item-A">
  33. A
  34. </view>
  35. </view>
  36. </mp-col>
  37. <mp-col>
  38. <view>
  39. <view class="item item-B">
  40. B
  41. </view>
  42. </view>
  43. </mp-col>
  44. </mp-row>
  45. </mp-col>
  46. <mp-col xs="{{0}}" span="{{8}}">
  47. <view>
  48. <view class="{{theme === 'dark' ? 'item dark-C' : 'item item-C'}}" style="height: 490px; line-height:480px;">
  49. C
  50. </view>
  51. </view>
  52. </mp-col>
  53. </mp-row>
  54. </view>
  55. </view>