我剛開始使用 Vue。我首先使用類樣式綁定語法。盡管在組件標(biāo)簽中引用了我在 CSS 中定義的頁(yè)眉和頁(yè)腳類，但它們并未顯示。我似乎不明白為什么。我嘗試將類放入組件中，但它們似乎也沒有顯示在那里。我有一種感覺，我必須在 Vue 應(yīng)用程序初始化程序中以某種方式綁定類？提前致謝！應(yīng)用程序.vue<template> <div id="app"> <div class="container"> <section> <LauchLogo class="header" /> <LauchSymbol class="footer" /> </section> <section> <LauchLogo class="header" /> <LauchSymbol class="footer" /> </section> </div> </div></template><script>import { Component, Vue } from "vue-property-decorator";import LauchLogo from "./components/LauchLogo.vue";import LauchSymbol from "./components/LauchSymbol.vue";@Component({ components: { LauchLogo, LauchSymbol }})export default class App extends Vue { data() { return { logo: 'logo', symbol: 'symbol' } }}</script><style>#app { font-family: Avenir, Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-align: center; color: #2c3e50;}body { height: 100vh; overflow: hidden;}* { margin: 0; padding: 0;}.container { width: 100%; height: 100%; overflow-y: scroll; scroll-behavior: smooth; scroll-snap-type: y mandatory;}section { display: flex; flex-direction: column; align-items: center; justify-content: space-evenly; width: 100vw; height: 100vh; scroll-snap-align: center;}.footer { border: 2px green;}.header { border: 2px blue;}</style>
1 回答
30秒到達(dá)戰(zhàn)場(chǎng)
TA貢獻(xiàn)1828條經(jīng)驗(yàn) 獲得超6個(gè)贊
您可能只需要向 CSS 添加邊框樣式屬性。您在此處添加的內(nèi)容不會(huì)顯示邊框：
.footer {
border: 2px green;
}
.header {
border: 2px blue;
}
但這會(huì)：
.footer {
border: 2px solid green;
}
.header {
border: 2px solid blue;
}
- 1 回答
- 0 關(guān)注
- 130 瀏覽
添加回答
舉報(bào)
0/150
提交
取消