CSS 선택기를 영리하게 사용하세요_Experience Exchange

다양한 콘텐츠 블록의 링크 스타일은 다양한 규칙을 통해 정의할 수 있습니다. 다음과 같습니다: #nav a:link 또는 #main a:link 또는 #footer a:link. 다양한 콘텐츠 블록의 동일한 요소에 대해 다양한 스타일을 정의할 수도 있습니다. 예를 들어, #main p와 #sider p를 통해 각각 #main p와 #sider p의 스타일을 정의합니다. 구조적으로 말하면 귀하의 페이지는 사진, 링크, 목록, 단락 등으로 구성됩니다. 이러한 요소 자체는 표시되는 네트워크 장치(PDA, 휴대폰 또는 인터넷 TV)에 영향을 미치지 않습니다.

신중하게 구성된 HTML 페이지는 매우 간단하며 모든 요소는 구조적 목적으로 사용됩니다. 단락을 들여쓰려면 blockquote 태그를 사용할 필요가 없습니다. p 태그를 사용하고 p에 CSS 텍스트 들여쓰기 규칙을 추가하면 들여쓰기 목적이 달성됩니다. p는 구조화된 태그이고 text-indent는 표시 속성입니다. 전자는 HTML에 속하고 후자는 CSS에 속합니다. (이것은 전설적인 구조와 성능의 분리입니다.)

잘 구성된 HTML 페이지에는 성능 속성 태그가 거의 없습니다. 코드가 매우 깔끔하고 간결합니다. 예를 들어, 원본 코드

는 이제 HTML로만 을 쓸 수 있고, 성능을 제어하는 ​​모든 것은 CSS로 작성됩니다. 구조화된 HTML에서 테이블은 다른 것이 아닌 테이블입니다(레이아웃에 사용되는 것은 말할 것도 없습니다). 그리고 포지셔닝).

물론 CSS 선택자는 그렇게 간단하지 않습니다. ID와 클래스 외에도 하위 항목 선택자, 속성 선택자 등이 있습니다.