实现效果
实现代码
background: linear-gradient(to left, #04ffff, #04ffff) left top no-repeat,
linear-gradient(to bottom, #04ffff, #04ffff) left top no-repeat,
linear-gradient(to left, #04ffff, #04ffff) right top no-repeat,
linear-gradient(to bottom, #04ffff, #04ffff) right top no-repeat,
linear-gradient(to left, #04ffff, #04ffff) left bottom no-repeat,
linear-gradient(to bottom, #04ffff, #04ffff) left bottom no-repeat,
linear-gradient(to left, #04ffff, #04ffff) right bottom no-repeat,
linear-gradient(to left, #04ffff, #04ffff) right bottom no-repeat;
background-size: 1px 6px, 6px 1px;
代码介绍
background
background-position:
left top
left center
left bottom
right top
right center
right bottom
center top
center center
center bottom
background-repeat:
repeat
背景图像将向垂直和水平方向重复。这是默认
repeat-x
只有水平位置会重复背景图像
repeat-y
只有垂直位置会重复背景图像
no-repeat
background-image 不会重复
inherit
指定 background-repeat 属性设置应该从父元素继承
background-size:length | percentage | cover | contain;
设置背景图片高度和宽度。第一个值设置宽度，第二个值设置的高度。如果只给出一个值，第二个是设置为 auto(自动)
Linear-gradient
linear-gradient() 函数用于创建一个表示两种或多种颜色线性渐变的图片。
创建一个线性渐变，需要指定两种颜色，还可以实现不同方向（指定为一个角度）的渐变效果，如果不指定方向，默认从上到下渐变。
