Priority in CSS when both id and tag are selected? [duplicate]

If the priority of the id selector in css is the highest, why are the background colors of the two p’s (test1 and test2) are same blue?

enter image description here

I have tried to change the order of selectors in the style code block and ways to express the id selector. like p #123 {} and #123 p {} .

I want to know the principle and how to use the id selector correctly in this case.
Thank you very much.