JSFiddle - React, Tailwind, and code Playground

by Karan1412

HTML

<h4>Demo for Existence selector</h4>
<a href="http://www.google.com" title="To Google">Google</a>
<a href="http://www.gmail.com">Gmail</a>

<h4>Demo for Equality selector</h4>
<p class="targetP">This is pargraph element with class targetP</p>
<p>This is pargraph element without class targetP</p>

<h4>Demo for Space selector</h4>
<div class="targetDiv firstDiv">This is first div element with multiple values for class attribute.</div>
<div class="sourceDiv">This is second div element with single value for class attribute.</div>

CSS

h4
{
    text-decoration:underline;
}

/*For Existence Selector*/
a[title]
{
    font-size:30px;
    font-family:comic sans ms;
}

/*For Equality Selector*/
p[class="targetP"]
{
    color:Green;
    font-size:30px;
    font-family:comic sans ms;
}

/*For Space Selector*/
div[class~=targetDiv]
{
    color:Orange;
    font-weight:bold;
}