Edit in JSFiddle

<h2>Four Corner Bevel</h2>

<div class="bevel all">
    <p>Content<br />Goes<br />Here</p>
</div>

<h2>Diagonal Bevel 1</h2>

<div class="bevel trbl">
    <p>Top right, bottom left</p>
</div>

<h2>Diagonal Bevel 2</h2>

<div class="bevel tlbr">
    <p>Top left, bottom right</p>
</div>

<h2>One Only</h2>

<div class="bevel tr">
    <p>One corner, see bottom bevel for spacing ...</p>
</div>

.bevel.all {
    background: #efefef; /* default color */
    background:
        -moz-linear-gradient(45deg,  transparent 10px, #efefef 10px),
        -moz-linear-gradient(135deg, transparent 10px, #efefef 10px),
        -moz-linear-gradient(225deg, transparent 10px, #efefef 10px),
        -moz-linear-gradient(315deg, transparent 10px, #efefef 10px);
    background:
        -o-linear-gradient(45deg,  transparent 10px, #efefef 10px),
        -o-linear-gradient(135deg, transparent 10px, #efefef 10px),
        -o-linear-gradient(225deg, transparent 10px, #efefef 10px),
        -o-linear-gradient(315deg, transparent 10px, #efefef 10px);
    background:
        -webkit-linear-gradient(45deg,  transparent 10px, #efefef 10px),
        -webkit-linear-gradient(135deg, transparent 10px, #efefef 10px),
        -webkit-linear-gradient(225deg, transparent 10px, #efefef 10px),
        -webkit-linear-gradient(315deg, transparent 10px, #efefef 10px);
}
.bevel.tlbr {
    background: #efefef; /* default color */
    background:
        -moz-linear-gradient(45deg,  #efefef 10px, #efefef 10px),
        -moz-linear-gradient(135deg, transparent 10px, #efefef 10px),
        -moz-linear-gradient(225deg, #efefef 10px, #efefef 10px),
        -moz-linear-gradient(315deg, transparent 10px, #efefef 10px);
    background:
        -o-linear-gradient(45deg,  #efefef 10px, #efefef 10px),
        -o-linear-gradient(135deg, transparent 10px, #efefef 10px),
        -o-linear-gradient(225deg, #efefef 10px, #efefef 10px),
        -o-linear-gradient(315deg, transparent 10px, #efefef 10px);
    background:
        -webkit-linear-gradient(45deg,  #efefef 10px, #efefef 10px),
        -webkit-linear-gradient(135deg, transparent 10px, #efefef 10px),
        -webkit-linear-gradient(225deg, #efefef 10px, #efefef 10px),
        -webkit-linear-gradient(315deg, transparent 10px, #efefef 10px);
}
.bevel.trbl {
    background: #efefef; /* default color */
    background:
        -moz-linear-gradient(45deg,  transparent 10px, #efefef 10px),
        -moz-linear-gradient(135deg, #efefef 10px, #efefef 10px),
        -moz-linear-gradient(225deg, transparent 10px, #efefef 10px),
        -moz-linear-gradient(315deg, #efefef 10px, #efefef 10px);
    background:
        -o-linear-gradient(45deg,  transparent 10px, #efefef 10px),
        -o-linear-gradient(135deg, #efefef 10px, #efefef 10px),
        -o-linear-gradient(225deg, transparent 10px, #efefef 10px),
        -o-linear-gradient(315deg, #efefef 10px, #efefef 10px);
    background:
        -webkit-linear-gradient(45deg,  transparent 10px, #efefef 10px),
        -webkit-linear-gradient(135deg, #efefef 10px, #efefef 10px),
        -webkit-linear-gradient(225deg, transparent 10px, #efefef 10px),
        -webkit-linear-gradient(315deg, #efefef 10px, #efefef 10px);
}
.bevel.tr {
    background: #efefef; /* default color */
    background:
        -moz-linear-gradient(45deg,  #efefef 10px, #efefef 10px),
        -moz-linear-gradient(135deg, #efefef 10px, #efefef 10px),
        -moz-linear-gradient(225deg, transparent 10px, #efefef 10px),
        -moz-linear-gradient(315deg, #efefef 10px, #efefef 10px);
    background:
        -o-linear-gradient(45deg,  #efefef 10px, #efefef 10px),
        -o-linear-gradient(135deg, #efefef 10px, #efefef 10px),
        -o-linear-gradient(225deg, transparent 10px, #efefef 10px),
        -o-linear-gradient(315deg, #efefef 10px, #efefef 10px);
    background:
        -webkit-linear-gradient(45deg,  #efefef 10px, #efefef 10px),
        -webkit-linear-gradient(135deg, #efefef 10px, #efefef 10px),
        -webkit-linear-gradient(225deg, transparent 10px, #efefef 10px),
        -webkit-linear-gradient(315deg, #efefef 10px, #efefef 10px);
}
.bevel.all, .bevel.trbl, .bevel.tlbr, .bevel.tr {
    background-position: bottom left, bottom right, top right, top left;
    -moz-background-size: 50% 50%;
    -webkit-background-size: 50% 50%;
    background-size: 50% 50%;
    background-repeat: no-repeat;
    margin-bottom: 15px;
    padding: 15px;
}

body {
    background: url(http://placehold.it/1x2/333/777);
    margin: 20px;
}
h2 {
    margin-bottom: 10px; 
    color: white;        
}