我的代码是这样的:

<div id="app">
  <v-app id="inspire">
    <v-content>
      <v-container>
        <v-card
          max-width="1000"
          class="mx-auto"
        >

          <v-form v-model="valid">
            <v-container>
              <v-row>
                <v-col
                  cols="12"
                  md="4"
                >
                  <v-text-field
                    label="First name"
                    required
                  ></v-text-field>
                </v-col>

                <v-col
                  cols="12"
                  md="4"
                >
                  <v-text-field
                    label="Last name"
                    required
                  ></v-text-field>
                </v-col>

                <v-col
                  cols="12"
                  md="4"
                >
                  <v-text-field
                    label="E-mail"
                    required
                  ></v-text-field>
                </v-col>
              </v-row>
            </v-container>
          </v-form>

        </v-card>
      </v-container>
    </v-content>
  </v-app>
</div>


演示如下:https://codepen.io/trendingnews/pen/oNgooPg?editors=1010

如果被macbook pro这样访问:

css - 在Windows和Macbook Pro上访问时,宽度卡为何不同?-LMLPHP

但是如果被这样的窗口访问:

css - 在Windows和Macbook Pro上访问时,宽度卡为何不同?-LMLPHP

看来窗户的宽度更大

如何使它相同?

注意

我尝试使用Macbook Pro 13英寸2017

我在Macbook中使用Bootcamp安装Windows。所以我可以在Macbook和Windows中看到它

最佳答案

从max-width中删除单词max应该起作用。
最大宽度是它可以达到的最大宽度。

如果适合但未达到最大值,则不会拉伸盒子。 (这就是您在Macbook上看到的内容。)

关于css - 在Windows和Macbook Pro上访问时,宽度卡为何不同?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/59580951/

10-11 23:36