CSS which takes precedence, inline or the class?

Question

My website has a stylesheet defined in the header as style.css with a selector:

.myClass {background:#000;}

Now my div looks like:

Answer 1

The order of precedence with CSS is as follows:

1. Inline, such as
   This is red
   .In this example, the class is ignored if the green class declaration has already tried to define the property of color.Also id is also ignored if it has tried to define the color.
2. Id Selector , such as #orange { color: orange; }
3. Class Selectors , such as .green { color: green; }
4. Element Selectors ,such as div { color: black; }

Mozilla Developer Network Documentation Has Well Written Documentation on That Which Says

When multiple rules apply to a certain element, the rule chosen depends on its style specificity. Inline style (in HTML style attributes) has the highest specificity and will override any selectors, followed by ID selectors, then class selectors, and eventually element selectors.

The text color of the below will therefore be red.

  div { color: black; }
   #orange { color: orange; }
   .green { color: green; }
  

 
This is red

---

^{Please Consult MDN for any HTML, CSS or JavaScript Knowledge, w3school does not have a very good reputation in developers community. For Further Info On This Matter Please Visit w3fools.}