页面样式

对于<router-view />组件，它实际上就是一个自定义标签，具有普通标签的特性，我们可以对其添加样式，但是这个标签没有唯一的根节点，需要通过<div>进行包裹，在根节点进行样式的设置：

<template>
	<router-link :to="{ name: 'home' }">Go to Home</router-link>
	<router-link :to="{ name: 'codeandcesium' }">Go to CodeAndCesium</router-link>
	<hr />
	<div class="router-view">
		<router-view />
    </div>
</template>

<script setup>
</script>

<style>
.router-view{
	background-color: gray;
    padding: 20px
}
</style>

这样经过路由渲染的页面都有相同的背景样式