為了使Vue的頁面布局更加美觀和合理，我們經常需要調整body元素的margin屬性。這個屬性可以用來控制頁面邊緣的距離，以及頁面中各個元素的排版間距。在Vue中，我們可以通過在App.vue的style標簽中設置body元素的margin屬性來實現這個目的。

body {
margin: 0;
}

上面的代碼將body元素的margin屬性設為0，這意味著頁面邊緣和元素間距均為0。這可能會導致頁面在不同的設備上顯示效果不一致，因為不同的設備有不同的屏幕分辨率和顯示比例。因此，我們可以使用百分比值來替代固定像素值，這樣可以在不同設備上保持頁面的一致性。

body {
margin: 0;
padding: 0;
font-size: 16px;
line-height: 1.5;
}
@media screen and (max-width: 768px) {
body {
margin: 0 5%;
}
}

這段代碼首先設置了body元素的font-size和line-height屬性，以確保頁面元素的字體大小和行間距是合適的。然后，它在@media查詢語句中設置了body元素的margin屬性，當視窗寬度小于768像素時，頁面邊緣的距離將為視窗寬度的5%。這個技巧可以讓頁面在小屏幕設備上更加適應，使用戶體驗更加友好。