target data attribute with css
you can add a data attribite and target it with css using the following demo
HTML
<div class='im-a-div' data-stuff="yellow"></div>
<div class='im-a-div' data-stuff="red"></div>
<div class='im-a-div' data-any-text="red"></div>
CSS
.im-a-div {
height:50px;
width:50px;
border-radius:5px;
margin-bottom:5px;
}
.im-a-div[data-stuff="yellow"] {
background:#FE0;
}
.im-a-div[data-stuff="red"] {
height:50px;
width:50px;
background:#F00;
}
.im-a-div[data-any-text="red"] {
border:3px solid #F00;
}
External Link for target data attribute with css