如何制作带有倾斜边缘的div？

Question

我有一个带阴影的简单div，我想知道如何/如果我可以添加一个额外的元素。这是代码：

h3.widget-title{
    background-color:#aac955; 
    -webkit-box-shadow: 0px 0px 0px 37px #aed449;
    -moz-box-shadow: 0px 0px 0px 37px #aed449;
    box-shadow: 0px 0px 0px 37px #aed449;
    color:#444; padding:5px 10px;
}

<div>
    <h3 class="widget-title">Title</h3>
    <p>Content</p>
</div>

以下是我要找的内容：

看到绿色边缘。我们的想法是将h3标题及其风格更多地放在前面。这样的事情可以通过CSS吗？

Answer 1

我使用了伪元素:before和:after，并使用了此网站的CSS代码：http://css-tricks.com/examples/ShapesOfCSS/来制作钩子。玩一点，你就会搞清楚。