<a href="#" class="stripe-box">
  <p>stripebox-hover</p>
</a>
.stripe-box{
  background-size: auto auto;
  background-color: rgba(254, 196, 110, 1);
  background-image: repeating-linear-gradient(
135deg
, transparent, transparent 5px, rgba(255, 214, 154, 1) 5px, rgba(255, 214, 154, 1) 10px );
  padding:5px 15px;
  display:block;
  text-decoration:none;
  color:#333;
}
.stripe-box > p{
  background:#fff;
  padding:15px;
}
.stripe-box:hover{
  background-size: auto auto;
  background-color: rgba(255, 214, 154, 1);
  background-image: repeating-linear-gradient(
135deg
, transparent, transparent 5px, rgba(254, 196, 110, 1) 5px, rgba(254, 196, 110, 1) 10px );
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.