您好，我該如何寫漸層色呢?

[hgalytoby]

我是前端的新手

我用 vue cli 創建了 Vue 專案

這是我的 main.js

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import Vue3Progress from 'vue3-progress'

const options = {
  position: 'fixed',
  height: '3px'
}
createApp(App).use(store).use(router).use(Vue3Progress, options).mount('#app')

這是我的 App.vue

<template>
  <div id="nav">
    <vue3-progress />
  </div>
  <router-view/>
</template>

<script>
export default {
  name: 'App',
  created () {
    this.$progress.start()
  }
}
</script>

我現在知道可以在 options 的 color 設定單一顏色的。

也知道如果不設定會有預設的彩色。

但是我想用自訂漸層色是藍黑。

我該如何使用呢?

謝謝您。

[meloalright]

可以试试这个

const options = {
  position: "fixed",
  height: "3px",
  color: `blue
  linear-gradient(to right, cyan, blue, darkblue, black, cyan)
  0 0 / 500% 100%`,
};

[hgalytoby]

可以试试这个

const options = {
  position: "fixed",
  height: "3px",
  color: `blue
  linear-gradient(to right, cyan, blue, darkblue, black, cyan)
  0 0 / 500% 100%`,
};

可以试试这个

const options = {
  position: "fixed",
  height: "3px",
  color: `blue
  linear-gradient(to right, cyan, blue, darkblue, black, cyan)
  0 0 / 500% 100%`,
};

謝謝您，我會研究這個 css 是做什麼的。

 `blue
  linear-gradient(to right, cyan, blue, darkblue, black, cyan)
  0 0 / 500% 100%`,