Sie pseudo-element
Grenze mit border-image
erstellen können und stellen Sie dann opacity
.
div {
position: relative;
margin: 50px;
font-size: 25px;
padding: 10px 25px;
display: inline-block;
}
div:after {
content: '';
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
border: 5px solid transparent;
border-image: url('http://www.circlek.org/Libraries/2013_branding_design_elements/graphic_CKI_horizontal_stripesblue_RGB.sflb.ashx') 22 22 repeat;
transform: translate(-5px, -5px);
opacity: 0.4;
}
<div>Element</div>
<div>Element <br> lorem</div>
Fügen Sie die Grenze-Bild zu einem pseudo-Element und verwenden Opazität –
@ Nenad Lösung: https://jsfiddle.net/bu6xt7pc/1/ –