怎么用css在图片右下方添加文字

有时候在一些广告图片的下面显示“广告”字眼，或者在gif动图也有显示，那么这个通过css怎么实现呢

我们来看html代码

在看em的css是怎么定义的，这么需要用到定义的属性

a {
 display: block;
 position: relative;
}

父元素的 position: relative;然后我们在来设置em属性

a em {
 position: absolute;
 right: 0;
 bottom: 0px;
 background: #fff;
 color: #666;
 padding: 0px 5px;
 border-radius: 3px 0 0 0;
 opacity: 0.3;
 font-size: 12px;
 font-style: normal;
}

然后子元素定位为 position: absolute;然后加上top ,left,bottom等属性定位左上，左下 ，右上，右下

这样就达到想要的效果了

来段完整的代码

css

\t