lg_frontend/components/PollutantTrends.vue

<!--首要污染物变化趋势-->
<template>
  <div class="pollutant-trends">
    <secondary-title :title="title"/>
  </div>
</template>

<script>
export default {
  name: "PollutantTrends",
  data() {
    return {
      title: '首要污染物变化趋势'
    }
  }
}
</script>

<style scoped lang="less">
.pollutant-trends{
  width: 100%;
  height: 601px;
  background-image: linear-gradient(62deg, rgba(8,31,55,0.10) 0%, rgba(18,50,81,0.10) 100%);
  border: 1px solid transparent; /* 先将边框颜色设置为透明 */
  border-image: linear-gradient(rgba(79,182,238,0), rgba(39,127,216,1)); /* 使用线性渐变作为边框图片 */
  border-image-slice: 1; /* 指定切分边框图像的位置 */
}
</style>