Try it Editor: CSS [attribute~="value"] Selector

Edit This Code :


<!DOCTYPE html>
<html>
<head>
<style>
[title~=flower] {
    border: 5px solid yellow;
}
</style>
</head>
<body>

<p>All images with the title attribute containing the word "flower" get a yellow border.</p>

<img src="https://www.w3schools.com/css/klematis.jpg" title="klematis flower" width="150" height="113">
<img src="https://www.w3schools.com/css/img_flwr.gif" title="flower" width="224" height="162">
<img src="https://www.w3schools.com/css/img_tree.gif" title="tree" width="200" height="358">

<p><b>Note:</b> For [<i>attribute</i>~=<i>value</i>] to work in IE8 and earlier, a DOCTYPE must be declared.</p>

</body>
</html>

Result :