微信小程序weui在线入门教程-WeUi基础组件-flex布局

约定不等于承诺〃 2024-02-19 15:48 82阅读 0赞

效果图
微信小程序交流群:111733917 | 微信小程序从0基础到就业的课程:https://edu.csdn.net/topic/huangjuhua
微信小程序weui在线入门教程

wxml代码

  1. <view class="page">
  2. <view class="page__hd">
  3. <view class="page__title">Flex</view>
  4. <view class="page__desc">Flex布局</view>
  5. </view>
  6. <view class="page__bd page__bd_spacing">
  7. <view class="weui-flex">
  8. <view class="weui-flex__item">
  9. <view class="placeholder">weui</view>
  10. </view>
  11. </view>
  12. <view class="weui-flex">
  13. <view class="weui-flex__item">
  14. <view class="placeholder">weui</view>
  15. </view>
  16. <view class="weui-flex__item">
  17. <view class="placeholder">weui</view>
  18. </view>
  19. </view>
  20. <view class="weui-flex">
  21. <view class="weui-flex__item">
  22. <view class="placeholder">weui</view>
  23. </view>
  24. <view class="weui-flex__item">
  25. <view class="placeholder">weui</view>
  26. </view>
  27. <view class="weui-flex__item">
  28. <view class="placeholder">weui</view>
  29. </view>
  30. </view>
  31. <view class="weui-flex">
  32. <view class="weui-flex__item">
  33. <view class="placeholder">weui</view>
  34. </view>
  35. <view class="weui-flex__item">
  36. <view class="placeholder">weui</view>
  37. </view>
  38. <view class="weui-flex__item">
  39. <view class="placeholder">weui</view>
  40. </view>
  41. <view class="weui-flex__item">
  42. <view class="placeholder">weui</view>
  43. </view>
  44. </view>
  45. <view class="weui-flex">
  46. <view>
  47. <view class="placeholder">weui</view>
  48. </view>
  49. <view class="weui-flex__item">
  50. <view class="placeholder">weui</view>
  51. </view>
  52. <view>
  53. <view class="placeholder">weui</view>
  54. </view>
  55. </view>
  56. </view>
  57. </view>

欢迎大家学习我的视频教程:微信小程序-WeUI界面布局设计入门到精通
微信小程序-WeUI界面布局设计入门到精通

发表评论

表情:
评论列表 (有 0 条评论,82人围观)

还没有评论,来说两句吧...

相关阅读