꼭 읽어야 할 CSS 권위 있는 가이드 노트

다음 편집자는 꼭 읽어야 할 CSS 권위 있는 가이드 노트를 제공합니다. 편집자님이 꽤 좋다고 생각하셔서 지금 공유하고 모두에게 참고용으로 드리고자 합니다. 에디터로 구경오세요

1장 CSS와 문서

1, 요소: 교체 요소(img 입력), 비 교체 요소(대부분의 범위).

2, 링크: rel(대표 관계: 스타일시트, 후보 스타일시트: 대체 스타일시트); 미디어: (전체(모든 프리젠테이션 미디어, 화면, 인쇄), 제목(조정 후보) ).

3, @import url(sheet1.css)을 스타일 내에서 사용해야 하며, 다른 CSS 규칙 앞에 배치해야 합니다.

4, 하위 접근성: c9ccee2e6ea535a969eb3f532ad9fe89 - 스타일-->531ac245ce3e4fe3d50054a55f265927, 이전 브라우저에서는 스타일을 무시하고 CSS를 이해할 수 있는 브라우저는 스타일 시트를 정상적으로 읽을 수 있습니다.

5, CSS 주석: /* */. 🎜>

제2장 선택자

1. 문장을 그룹화할 때는 반드시 각 문장의 끝에 점을 사용하세요.

2, p.warming.help {배경:red;}는 클래스에 따뜻함과 도움말이 포함된 p 요소만 일치합니다. p에 따뜻함과 기타 요소가 포함되어 있으면 일치할 수 없습니다. 실제로 브라우저는 해당 요소의 고유성을 확인하지 않습니다. 하지만 이렇게 하면 dom

4, 속성 선택기: h1[class] {...}

h1[class=''] 작성이 더 어려워집니다. {...} 완전 일치

h1[class~=''] {...} 부분 일치 [class^=''] [class$ start with ='']는 무엇으로 끝나나요? class*=''] 모든 요소 포함

*[lang|='en']en과 같거나 en으로 시작하는 lang 속성을 선택하는 특정 속성 선택기 -

5, 하위 요소 선택: h1>strong; 인접한 형제 요소 h1+p를 선택합니다(h1과 p는 공통 상위 요소를 갖고 마지막으로 p를 선택합니다). 링크 의사 클래스: 방문하지 않은 링크: 링크: 방문함. (둘 다 정적임), 8f1663f1a1021d031485f1b9a8aaa766

동적 의사 클래스: focus.:focus, mouseover:hover, 활성화: 활성(동적 의사- 클래스는 모든 요소에 사용 가능)

권장되는 의사 클래스 순서: link-visited-focus-hover-active. 오해하기 쉬운 첫 번째 하위 요소(:first-child)는 모두 첫 번째 하위 요소(다음 예에서 첫 번째 하위 요소인 요소에는 첫 번째 p, 첫 번째 li 및 Strong 및 em이 포함됩니다).

<p>
    <p>helooo</p>
    <ul>
        <li>111</li>
        <li><strong>222</strong></li>
    </ul>
    <p>
        <em>333</em>
    </p>
</p>

*:lang(fr){color:red;}와 같이 언어(:lang())에 따라 선택하면 모든 프랑스어 요소가 빨간색으로 변합니다.

의사 요소 선택기: 첫 번째 문자: 첫 번째 문자, 사용자 에이전트는 의사 요소 4cf5accdc40730dafd31ecc4246713c2;

첫 번째 줄: 첫 번째 줄

전후:전:후.

위 내용은 꼭 읽어야 할 CSS 권위 있는 가이드 노트의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!