세 가지 방법의 우선순위
3가지 방법을 동시에 사용하여 동일한 요소에 CSS 스타일을 설정하는 경우 어떤 방법이 실제로 효과적인가요? 오른쪽 에디터에서는 이런 일이 일어났습니다
1. 内联式
CSS를 사용하여 "Super Cool Internet" 텍스트를 粉色
으로 설정합니다.
2. 그런 다음 嵌入式
CSS를 사용하여 텍스트를 红色
으로 설정합니다.
3. 마지막으로 外部式
을 사용하여 텍스트를 蓝色
(style.css 파일에 설정)으로 설정합니다.
하지만 마지막으로 "Cool Internet"이라는 짧은 단어의 텍스트가 粉色
으로 설정되어 있는 것을 확인할 수 있습니다. 이 세 가지 스타일에는 우선순위가 있으므로 우선순위를 기억하세요. 内联式 > 嵌入式 > 外部式
하지만 임베디드>외부 스타일에는 전제 조건이 있습니다. 임베디드 CSS 스타일의 위치는 다음과 같습니다. 외부 스타일에 뒤쳐져 있습니다. 예를 들어, 올바른 코드 편집기에서 <link href="style.css" ...> 코드는 <style type="text/css">...</style> ; 코드(실제로는 개발 중에도 작성되었습니다). 관심 있는 친구들은 시도해 보고 순서를 바꿔서 우선순위가 바뀌는지 확인할 수 있습니다.
사실 정리하면 --就近原则(离被设置元素越近优先级别越高)
입니다.