在图像周围使用非常特定的形状设置边框

【问题标题】：Styling the border with a very specific shape around an image在图像周围使用非常特定的形状设置边框
【发布时间】：2017-09-29 20:03:42
【问题描述】：

对网络开发人员非常陌生，如果我听起来不知道自己在做什么，请提前道歉。试图在图像周围设置这种类型的边框，但无法用那个特定的角落做到这一点。有什么想法吗？check the link please cannot embed images into this post

【问题讨论】：

标签： html css css-shapes

【解决方案1】：

有两个块。你可以使用这样的东西（红色的图片）

.bg
{
    width: 120px;
    height: 120px;
    border: solid green;
}

.image
{
    position: relative;
    top: 30px;
    left: 30px;
    width: 100px;
    height: 100px;
    background-color: red;
}

<html>
<head>
</head>
<body>
<div class="bg">
<div class="image">

</div>
</div>
</body>
</html>

【讨论】：