<h3>Links :</h3>
<a href="www.google.com">Google</a>
<a href="www.twitter.org">Twitter</a>
<a href="https://www.facebook.com">Facebook</a>
<a href="http://www.youtube.com">Youtube</a>


<h3>Images :</h3>
<img src="an invalid url" alt="a fire hose"/>
<img src="an invalid url" alt="bonfire camping"/>
<img src="an invalid url" alt="fire-fighters"/>
<img src="an invalid url" alt="large wildfire"/>

body{ 
  display: grid; /* to align all elements vertically */
}

a[href]{ /* has href attribute*/
  margin: 5px;
}

a[href ^= "https"]{/* value begins with "https" */
  font-size: x-large;
}

a[href $= "org"]{ /* value ends with "org" */
  background-color: red;
  color: yellow;
}

a[href *= "oo"]{/* value has "oo" */
  background-color: green;
  color: white;
}

img[alt *= "fire"]{ /* has fire anywhere */
  background-color: red;
}

img[alt ~= "fire"]{ /* has fire in a space-separated list */
  color: blue;
}

img[alt |= "fire"]{ /* has fire followed by an hyphen */
  margin: 10px;
}

img[alt $= "fire"]{ /* ends with fire */
  background-color: green;
  color: yellow;
}