技術標籤：web前端+csscss3csshtml

一、先上效果圖

二、一個盒子div

<div class="siFrame"></div>

三、css程式碼

.siFrame {
	width: 200px; 
	height: 100px; 
	margin: auto;
	background: linear-gradient(to left, #4980D9, #4980D9) left top no-repeat, 
	linear-gradient(to bottom, #4980D9, #4980D9) left top no-repeat, 
	linear-gradient(to left, #4980D9, #4980D9) right top no-repeat,
	linear-gradient(to bottom, #4980D9, #4980D9) right top no-repeat, 
	linear-gradient(to left, #4980D9, #4980D9) left bottom no-repeat,
	linear-gradient(to bottom, #4980D9, #4980D9) left bottom no-repeat,
	linear-gradient(to left, #4980D9, #4980D9) right bottom no-repeat,
	linear-gradient(to left, #4980D9, #4980D9) right bottom no-repeat;
	background-size: 2px 15px, 15px 2px, 2px 15px, 15px 2px; 
	}
 

四、調顏色就是（）裡面、長度和粗度background-size裡面的四個屬性，選擇自己需要的調