Vue 是一個漸進式的 JavaScript 框架，主要用于構建用戶界面。它采用組件化的方式，可以輕松地創建并組合復雜的用戶界面。

在 Vue 中，可以通過單文件組件 (SFC) 來定義一個組件。在 SFC 中，可以同時定義組件的 HTML 模板、JavaScript 邏輯代碼以及 CSS 樣式。

<template>
<div class="component">
<h1>{{title}}</h1>
<p>{{description}}</p>
</div>
</template>
<script>
export default {
name: 'MyComponent',
props: {
title: String,
description: String
}
}
</script>
<style>
.component {
background-color: #f9f9f9;
border: 1px solid #ddd;
padding: 20px;
margin-top: 20px;
}
</style>

在 SFC 中，我們使用 template 標簽來定義組件的 HTML 模板。使用 script 標簽來定義組件的 JavaScript 邏輯代碼。使用 style 標簽來定義組件的 CSS 樣式。

最后，我們需要在應用程序中使用組件。在 Vue 中，使用 Vue.component 方法來注冊組件，并在 HTML 中使用組件的名稱來使用它。

<template>
<div>
<my-component 
title="Hello, Vue!"
description="This is a component created with Vue.">
</my-component>
</div>
</template>
<script>
import MyComponent from './MyComponent.vue'
export default {
name: 'App',
components: {
MyComponent
}
}
</script>
<style>
/* CSS styles */
</style>