我正在嘗試將文本設置在 vuetify 芯片內的兩行不同的行中，但我嘗試了幾種不同的方法。即使為文本的每個部分設置自己的行，但它似乎仍然在同一行。關于如何修復它有什么想法嗎？這是一支樣品筆new Vue({ el: "#app", data() { return {}; }});<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/vuetify.min.css" rel="stylesheet" /><link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900|Material+Icons" rel="stylesheet" /><script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script><script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vuetify.min.js"></script><div id="app"> <v-app id="inspire"> <v-container> <v-layout> <v-flex xs5> <v-chip close> <v-layout> Hello !! </v-layout> <v-layout> <div> There </div> </v-layout> </v-chip> </v-flex> </v-layout> </v-container> </v-app></div>所以基本上 Hello 和 There 應該在下一行！謝謝
1 回答
郎朗坤
TA貢獻1921條經驗 獲得超9個贊
您嘗試過簡單的<br/>標簽嗎？
new Vue({
el: "#app",
data() {
return {};
}
});
.v-chip .v-chip__content {
height: auto !important;
}
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/vuetify.min.css" rel="stylesheet" />
<link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900|Material+Icons" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vuetify.min.js"></script>
<div id="app">
<v-app id="inspire">
<v-container>
<v-layout xs4>
<v-chip close>
Hello !!<br/> There
</v-chip>
</v-layout>
</v-container>
</v-app>
</div>
- 1 回答
- 0 關注
- 124 瀏覽
添加回答
舉報
0/150
提交
取消