HTML5+CSS3의 새로운 콘텐츠 요약-HTML 튜토리얼-php.cn

HTML5+CSS3의 새로운 콘텐츠 요약

零到壹度

풀어 주다： 2018-03-24 10:02:56

원래의

1733명이 탐색했습니다.

H5+C3 하면 내용이 너무 많다고 생각하시나요? 오늘은 요약을 해봤습니다.

CSS3 선택자는 무엇인가요?
속성 선택자, 의사 클래스 선택자, 의사 요소 선택자.

CSS3의 새로운 기능은 무엇인가요?
1. 색상: RGBA, HSLA 모드 추가
2. 텍스트-그림자(text-shadow)
3. 테두리: 둥근 모서리(border-radius)
4.
5. Background: background-size는 배경 이미지의 크기를 설정합니다. background-origin은 배경 이미지의 원본을 설정합니다.
background-clip은 ""로 구분된 배경 이미지의 자르기 영역을 설정합니다. 여러 배경을 설정할 수 있습니다. 적응형 레이아웃용
6 .Gradient: 선형 그라데이션, 방사형 그라데이션
7. 전환: 전환, 애니메이션 구현 가능
8. CSS3에 도입된 유일한 의사 요소는
10입니다. 미디어 쿼리, 다중 열 레이아웃
11. 테두리 이미지
12.2D 변환: 변환: 변환(x, y) 회전(x, y) 왜곡(x, y) 스케일(x, y)
13.

CSS3 new 의사 클래스란 무엇인가요?

:first-child는 요소의 첫 번째 하위 요소를 선택합니다. :last-child는 요소의 마지막 하위 요소를 선택합니다. :nth-child(n)는 요소 하위 요소의 하나 이상의 특정 요소를 선택합니다. 예: p:nth-child(3): 세 번째 요소는 p 요소여야 하며, 그렇지 않으면 유효하지 않습니다.

:nth-child(length);/*参数是具体数字*/
:nth-child(n);/*参数是n,n从0开始计算*/ 
:nth-child(n*length)/*n的倍数选择，n从0开始算*/
:nth-child(n+length);/*选择大于length后面的元素*/
:nth-child(-n+length)/*选择小于length前面的元素*/
:nth-child(n*length+1);/*表示隔几选一*/
//上面length为整数
:nth-child(n) //就是所有选择的元素
“n”只能是"n"，不能使用其他字母代替，不然会没有任何效果的。

로그인 후 복사

:nth-last-child()는 요소의 하나 이상의 특정 하위 요소를 선택합니다. 마지막 하위 요소부터 계산합니다.
:nth-of-type()은 지정된 요소를 선택합니다.
예: p:nth-of-child(3)는 세 번째 p 요소를 선택합니다.

:nth-last -of-type() 마지막 요소부터 계산하여 지정된 요소를 선택합니다.
:first-of-type은 상위 요소 아래에서 첫 번째 유사한 하위 요소를 선택합니다.
:last-of-type은 상위 요소를 선택합니다. 동일한 유형의 마지막 하위 요소

: only-child는 상위 요소의 유일한 요소인 요소를 선택합니다.

: only-of-type은 상위 요소와 동일한 유형의 유일한 하위 요소인 요소를 선택합니다.
: 요소에 콘텐츠가 없습니다. selected by 공백
:not() 선택기와 일치하지 않는 요소는 양식 컨트롤의 비활성화 상태를 제어하는 특정 요소
:enabled, :disabled 이후를 제외한 모든 요소입니다.
:선택하면 라디오 버튼이나 확인란이 선택됩니다.
::first-line은 요소의 첫 번째 줄을 선택합니다.
::first-letter는 텍스트 블록의 첫 번째 문자를 선택합니다.
::before와 ::after는 주로 요소 앞이나 뒤에 내용을 삽입하는 데 사용됩니다. "content"는 함께 사용됩니다. 가장 많이 작성된 것은 float를 지우는 것입니다.
::selection은 웹 페이지를 탐색할 때 텍스트를 선택하는 기본 효과를 변경하는 데 사용됩니다. HTML5의 새로운 기능은 무엇이며 어떤 요소가 제거되었나요? HTML5 새 태그의 브라우저 호환성 문제를 어떻게 처리합니까? HTML과 HTML5를 구별하는 방법은 무엇입니까?

새로운 기능:

1. 드래그 앤 드롭 API

2. 더 나은 의미의 콘텐츠 태그(머리글, 탐색, 바닥글, 옆, 기사, 섹션)

3. 오디오 및 비디오 API . Canvas API
5. Geolocation API 6. 로컬 오프라인 저장소 localStorage는 브라우저를 닫은 후에도 데이터가 손실되지 않습니다. 7. 세션 저장소 데이터는
이후 자동으로 삭제됩니다. 8. 양식 컨트롤, 달력, 날짜, 시간, 이메일, URL, 검색
9. 새로운 기술 webworker, websocket, Geolocation

HTML5 새 태그 지원:

* 문서에서 생성된 태그를 통해 IE8/IE7/IE6 지원. createElement 메소드,
이 기능을 사용하면 이러한 브라우저가 HTML5 새 태그를 지원하도록 할 수 있습니다.

브라우저가 새 태그를 지원한 후에는 태그의 기본 스타일도 추가해야 합니다.

* 물론 가장 좋은 방법은 성숙한 프레임워크를 직접 사용하는 것입니다. 가장 많이 사용되는 프레임워크는 html5shim 프레임워크입니다.

위 내용은 HTML5+CSS3의 새로운 콘텐츠 요약의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!