分割线 代码

  .data-item:first-of-type {border-right: 2px solid;border-image: linear-gradient(to top,rgba(0, 0, 0, 0.1) 0%,rgba(81, 110, 197, 0.76) 50%,rgba(0, 0, 0, 0.1) 100%)1;padding: 15px 0;}

四角边框样式 代码

.chart-box {cursor: pointer;background: linear-gradient(to left, #03a9f3, #03a9f3) left top no-repeat,linear-gradient(to bottom, #03a9f3, #03a9f3) left top no-repeat,linear-gradient(to left, #03a9f3, #03a9f3) right top no-repeat,linear-gradient(to bottom, #03a9f3, #03a9f3) right top no-repeat,linear-gradient(to left, #03a9f3, #03a9f3) left bottom no-repeat,linear-gradient(to bottom, #03a9f3, #03a9f3) left bottom no-repeat,linear-gradient(to left, #03a9f3, #03a9f3) right bottom no-repeat,linear-gradient(to left, #03a9f3, #03a9f3) right bottom no-repeat;background-size: 2px 10px, 10px 2px, 2px 10px, 10px 2px;transition: all 0.4s ease;border: 1px solid transparent;position: absolute;left: 0px;top: 10px;
}.chart-box:hover {border: 1px solid #357bc6;
}