HTML을 작성하는 과정에서 클래스 속성에 대해 여러 값을 정의하는 경우가 많지만, 정의한 값이 유효하지 않은 경우도 종종 발견됩니다! ! !
예전에는 이런 상황이 발생하면 직접 다시 작성하거나 ID를 직접 사용하여 CSS 속성을 설정했지만 오늘 생각해보니 뭔가 잘못된 것 같습니다. . . 진실을 찾아야 해요! ! !
저는 2개입니다. 클래스별로 설정된 색상이 다릅니다. middle_div에 설정된 색상은 빨간색이고,
의 결과는 녹색입니다. 방향이 반대!
그래서 두 위치를 바꿔봤는데 여전히 초록색이에요! !
이것. . . .
그럴까요? ? ?
css 파일을 열어서 살펴보세요. 당연히 padding_10이 middle_div 앞에 있습니다.
브라우저를 새로 고쳤습니다. ! !
그래서 여러 클래스 값을 정의할 때 가장 좋아하는 스타일을 마지막에 꼭 넣어주세요!
하지만 padding_10 앞에 div를 추가하면(상위 요소가 div라고 가정) div.padding_10이 되며 어디에 있든 p div는 항상 녹색입니다.
이 예에서 볼 수 있듯이 CSS 스타일의 우선 순위는 나중에 html에서 클래스 속성의 위치에 따라 결정되는 것이 아니라 CSS 파일이 로드될 때 결정됩니다.
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
