图片水印和水印字

1.水印文字

```

        

img

售完

```

效果


2.图片作为水印

```

img

.parentBox{

position: relative;

width: 200px;

height: 300px;

}

.parentBox img{

width: 100%;

height: 100%;

}

.parentBox .sk{

position: absolute;

width: 100px;

height: 100px;

top: calc(50% - 50px);

left: calc(50% - 50px);

background: rgba(100,100,100,.6);

border-radius: 50%;

text-align: center;

line-height: 100px;

color: #fff;

/* border: 5px solid #aaa; */

font-size: 20px;

background: url(img/sellOut.png) no-repeat;

background-size: 100%;

}

img/productImg.jpg" alt="">

```

你可能感兴趣的:(图片水印和水印字)