1 The highest priority position is the <style> element of the header of the HTML document.
2 The location of the second priority is the style sheet imported by the @import statement in the <style> element.
3 The position of the third priority is the style sheet attached to the <link> element
4 Fourth priority position is the style sheet imported by the @import statement in the <link> element attached style sheet
5 5th Priority location is the end-user-attached style sheet
One exception is the!important rule in the end-user style sheet, which has the highest precedence. This allows the user to create rules that override the competition rules in the initial style sheet
6The last one is the default style sheet provided by the browser ~
If more than one style sheet is attached or imported at the same location level, their precedence is determined by the additional order, and the appended style sheet overrides the previously attached style sheet.
If the competition rules belong to the same selector group, have the same number and rank selectors, and have the same position level, then the rule in the code will overwrite the previous rule.
Style sheet Precedence Order