css inheritance properties and specificity with explanation

In this tutorial, discussed CSS inheritance, it works on a property by property basis.
therefore, When CSS defined properties applied to an element in a document, a property with the value ‘inherit’ will use the same value as the parent element has for that property.

For example, if the font-size property is declared in CSS Document for the BODY element, then font-size properties is automatically applied to all the elements present inside the BODY element.

the most advantages of CSS inheritance is that it saves your time in writing the repeated
code segment in documents for every single element that consists of the Web page.

And see this in HTML fragment:

Automatically Inherited CSS Properties

font-weight font-size font-variant font-style
font-family font-stretch font-size-adjust font-variant-position
font-variant-caps font-variant-caps text-decoration text-overflow
text-anchor text-rendering text-indent text-shadow
text-transform border-top border-bottom border-right
border-left border-style border-spacing border-color
border-width padding padding-right padding-left
padding-bottom padding-top margin margin-bottom
margin-top margin-right margin-left column-rule
color-profile caption-side counter-reset cursor
column-fill column-width color-interpolation counter-increment
column-span column-gap background background-attachment
background-origin background-repeat background-color background-size
backface-visibility background-position background-image background-clip

Styles can be inherited from a parent

Some styles, like font-size, text-alignment, font family etc., are automatically inherited by child elements
from their parent element

Others properties style is not automatically inherited.

Later styles over-rule earlier styles

first, define style property, and later define an alternative style property for the same thing (HTML Documents), the later definition over-rules the earlier one.