Vue是一種流行的JavaScript框架，它允許我們輕松地構建交互式Web應用程序。Vue擁有許多高級功能，其中包括公共樣式的使用。在Vue中，我們可以通過CSS文件將公共樣式應用于整個應用程序。

在Vue應用程序中，我們可以使用pre標簽來編寫我們的CSS代碼，以便輕松地應用樣式和便捷地查看和修改樣式文件。例如，我們可以使用類似下面這樣的代碼來定義我們的CSS樣式：

/* 定義一個公共的樣式 */
.common-style {
font-size: 16px;
color: #333;
}

在Vue應用程序中，我們可以通過導入CSS文件將這些樣式應用于整個應用程序。例如，我們可以創建一個名為“common.css”的文件，并在該文件中定義公共樣式，如下所示：

/* common.css */
.common-style {
font-size: 16px;
color: #333;
}

我們然后可以使用import語句將這個CSS文件導入到我們的Vue組件中，并在<style>標簽中使用這些樣式。例如：

<template>
<div class="my-component">
<p class="common-style">Hello, Vue!</p>
<p class="common-style">Welcome to my app!</p>
</div>
</template>
<script>
import './common.css';
export default {
name: 'MyComponent'
}
</script>
<style>
/* 定義my-component組件的樣式 */
.my-component {
background-color: #f5f5f5;
}
</style>

在這個例子中，我們使用了“common.css”文件中定義的公共樣式類名“common-style”來樣式化兩個段落。這些樣式在Vue應用程序的整個組件層次結構中都繼承自“common.css”文件。

因此，在Vue中使用公共樣式類可以大大簡化樣式管理，確保樣式的一致性，以及提高應用程序的可維護性和可擴展性。