[Transfer] HTML style priority

Several categories of style priority

1. Inherited styles (no priority)

<view class="c1">
<span>span text</span>
</view>

The styles in the span will inherit all the styles defined in the view, but once the span has its own styles, it will override the styles inherited from the view

2. Wildcard style

* Defined styles

*The asterisk  defines a wildcard style, all tags of the referenced style file are available, and if the tag has its own style, it will also override the same attribute value in the wildcard style

3. Label style

The style defined by the tag name

The style named after the system label is applicable to this type of label in the file. If the label has its own style... Same as above

4. class style

html

style named c1

5. id style

html

#id1 {
……
} 

6. style style

The style modified with shyle in the head

After reading the styles, let’s start with the hard dishes, and explain the priority of the above six styles

1. Inherited styles have no precedence
2. *Global style priority 0
3. div style priority 0, 0, 0, 0
4. .class class style priority 0, 0, 1, 0
5. #id style priority 0, 1, 0, 0
6. style style priority 1, 0, 0, 0

Sort: 6>5>4>3>2>1

        Do you think it’s over here, no, no, there is another style modifier [ !important ] serious statement

        If [ !important ] is added after the attribute, it means that the attribute is irreplaceable, and the modification with [ !important ] shall prevail