Inheritance

Estimated reading: 1 minute 69 views

When you nest one element inside another, the nested element will
inherit the properties assigned to the containing element. Unless you
modify the inner elements values independently.
For example,

				
					 body {font-family: Verdana, serif;}

Now all text within the (X)HTML file will be set to Verdana.
If you wanted to style certain text with another font, like an h1 or a
paragraph then you could do the following.

				
					 h1 {font-family: Georgia, sans-serif;}
 p {font-family: Tahoma, serif;}

There are instances where nested elements do not inherit the containing
elements properties.
For example, if the body margin is set to 20 pixels, the other elements
within the file will not inherit the body margin by default.

				
					 body {margin: 20px;}