Html vuetify v-col xs=";12“;只填充一半宽度

Html vuetify v-col xs=";12“;只填充一半宽度,html,css,vue.js,vuetify.js,Html,Css,Vue.js,Vuetify.js,我想知道,当屏幕大小为时,为什么vuetify断点不起作用?这是两个因素的组合 v-col没有可用的XS道具 列会自动占用其父容器中的整个可用空间,除非您事先指定了它应该占用的宽度 列将自动在其父容器中占用相等的空间。这可以使用cols道具进行修改。您还可以利用sm、md、lg和xl道具进一步定义列在不同视口大小下的大小 要解决此问题,请将v-col的“cols”属性设置为12,以指示它应在所有视口中占据12列。您可以将其视为您试图使用的“XS”属性。然后,任何较大的视口都将继承最后一个有效大

我想知道,当屏幕大小为时,为什么vuetify断点不起作用?这是两个因素的组合

  • v-col没有可用的XS道具
  • 列会自动占用其父容器中的整个可用空间,除非您事先指定了它应该占用的宽度 列将自动在其父容器中占用相等的空间。这可以使用cols道具进行修改。您还可以利用sm、md、lg和xl道具进一步定义列在不同视口大小下的大小

    要解决此问题,请将v-col的“cols”属性设置为12,以指示它应在所有视口中占据12列。您可以将其视为您试图使用的“XS”属性。然后,任何较大的视口都将继承最后一个有效大小

    <v-col
      v-for="n in 3"
      :key="n"
      cols="12"
      md="4"
    >
    
    
    
    XS道具是否可用于v-row或任何其他网格容器?如果XS道具不适用于何处?Vuetify 1.5在容器上使用了
    XS
    属性,但在Vuetify 2中用
    cols
    替换了它。