A Pen by Dave Edwards.

index.html

<div class="box bmw">
  <div class="ribbon">
        <div class="txt">
CD Player        </div>
    </div>
<div>
  


  

Ribbon-over-photo.markdown

Ribbon over photo

A Pen by Dave Edwards on CodePen.

License.

style.css

.box {

    width: 300px;
    height: 300px;

}

.bmw{  background-image: url(http://www.eurodb.com.au/New-used-car-review/wp-content/uploads/2013/04/Official-Car-of-MottoGP-Safety-Car-BMW-M6-Gran-Coupe.-300x300.jpg);
  
  
}



.ribbon {
  -webkit-transform: rotate(-45deg); 
     -moz-transform: rotate(-45deg); 
      -ms-transform: rotate(-45deg); 
       -o-transform: rotate(-45deg); 
          transform: rotate(-45deg); 
    border: 25px solid transparent;
    border-bottom: 25px solid blue;
    position: absolute;
 top:30px;
 left:-37px;
    padding: 0 10px;
    width: 115px;
    color: white;
    font-family: sans-serif;
    font-size: 18px;
  font-weight:bold;
}
.ribbon .txt {
    position: absolute;

    top: 1px;
    left: 30px;
}