实例:

左侧:通过定义.mui-col-sm-6类在大屏(≥400px)设备上会展现为并排的两列,而.mui-col-xs-12在小屏(<400px)设备上会覆盖之前定义的类展现为水平排列

实例: - 图1

实例: - 图2

  1. <div class="mui-content">
  2. <div class="mui-row">
  3. <div class="mui-col-sm-6 mui-col-xs-12">
  4. <li class="mui-table-view-cell">
  5. <a class="mui-navigate-right">
  6. Item 1
  7. </a>
  8. </li>
  9. </div>
  10. <div class="mui-col-sm-6 mui-col-xs-12">
  11. <li class="mui-table-view-cell">
  12. <a class="mui-navigate-right">
  13. Item 1
  14. </a>
  15. </li>
  16. </div>
  17. </div>
  18. </div>