Css中怎样才能添加图片边框呢?

[图片] 就是图片上右下角的边框,想了好几种方法实行不了,谢谢大家的回答
关注者
9
被浏览
4,678

11 个回答

其实可以直接一个 img 标签就可以了。 img 标签作为 HTML 的元素之一 ,是可以设置背景的。因此只需要通过 padding 预留空间,然后把你需要的图片作为背景图塞进去,那个边框圆弧的图形,作为 img src 路径放上去。

<img src="https://mp.weixin.qq.com/mp/qrcode?scene=10000005&size=102&__biz=MzI1MTA2MDcyOQ==&mid=2649567913&idx=1&sn=05b4c488cca33b5d8d3c065512ea7a25&send_time=" alt="">


img {
	display: block;
	width: 200px;
	height: 200px;
	padding: 350px 50px 50px 350px;
	border: 1px solid #000;
	background: url(https://pic3.zhimg.com/80/v2-db3dc7db5b0e927855afb60599563013_1440w.jpg) no-repeat;
	background-size: cover;
}

src 里的就是那个二维码了,背景图片了……

基本就是相对 + 绝对定位实现效果

<style>
      .box {
        position: relative;
        width: 450px;
        height: 300px;
        overflow: hidden;
      .box p {
        position: absolute;
        bottom:0;
        left:0;
        right: 0;
        width: 100%
        line-heihgt: 3;
        padding: 10px;
        text-align: right;
        border-radius:50px 0 0 0;
        background-color: rgba(255,255,255,0.8);