Cascade Order : Selector priority : Style Basics HTML CSS TUTORIALS

HTML CSS TUTORIALS » Style Basics » Selector priority »

Cascade Order


 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<style type="text/css">
* {
  border: 0px solid black;
} 
div {
  border: 2px solid black;
} 
* .c10 {
  border: 4px solid black;
} 
#i100 {
  border: 6px solid black;
} 
* {
  border: 8px solid black !important;
} 
div {
  border: 10px solid black !important;
} 
* .c10 {
  border: 12px solid black !important;
} 
#i100 {
  border: 14px solid black !important;
} 
</style>
</head>
<body> 
<div id="i100" class="c10">!important has highest priority.</div> 
</body> 
</html>