.rect {
position: absolute;
top: 20px;
left: 20px;
width: 100px;
height: 100px;
background: linear-gradient(to left, #000, #000) left top no-repeat,
linear-gradient(to bottom, #000, #000) left top no-repeat,
linear-gradient(to left, #000, #000) right top no-repeat,
linear-gradient(to bottom, #000, #000) right top no-repeat,
linear-gradient(to left, #000, #000) left bottom no-repeat,
linear-gradient(to bottom, #000, #000) left bottom no-repeat,
linear-gradient(to left, #000, #000) right bottom no-repeat,
linear-gradient(to left, #000, #000) right bottom no-repeat;
background-size: 1px 20px, 20px 1px, 1px 20px, 20px 1px;
}
<div class='rect'></div>
可根据需求改成渐变色~