四隅の境界線効果を実現するCSS

 <div
            クラス = "ボックス"
            v-for="coldBaseInfo.stationModelList の (項目, インデックス)"
            :key="インデックス"
          >
            <div class="boxleft">
              <img :src="写真[インデックス]" alt="画像" />
            </div>

 写真： [
        require("@/assets/img/bigscreen/two.jpg"),
        require("@/assets/img/bigscreen/four.png"),
        require("@/assets/img/bigscreen/five.jpg"),
        require("@/assets/img/bigscreen/ten.jpg"),
      ]、

 .boxleft {
  背景: 線形グラデーション(左へ、#04C886、#04C886) 左上、リピートなし、
        線形グラデーション(下へ、#04C886、#04C886) 左上、繰り返しなし、
        線形グラデーション(左へ、#04C886、#04C886) 右上、繰り返しなし、
        線形グラデーション(下へ、#04C886、#04C886) 右上、繰り返しなし、
        線形勾配(左へ、#04C886、#04C886) 左下繰り返しなし、
        線形グラデーション(下へ、#04C886、#04C886) 左下 繰り返しなし、
        線形グラデーション(左へ、#04C886、#04C886) 右下 繰り返しなし、
        Linear-gradient(左へ、#04C886、#04C886) 右下 no-repeat;
    背景サイズ: 2px 10px、10px 2px、2px 10px、10px 2px;
  画像 {
    幅: 100%;
    高さ: 100%;
    パディング: 4px;
    ボーダー: 2px ソリッド #7fb1c580;
  } 
}