CSS3은 아직 진정한 표준이 되지 않았기 때문에 많은 브라우저가 이를 지원하는 수준이 다르고 각 브라우저 제조업체는 동일한 스타일을 다른 방식으로 지원하므로 브라우저 간 호환성을 확보하려면 접두어를 추가해야 합니다. css3 접두사는 특정 브라우저 렌더링 엔진에서 새로운 속성을 인식하고 적용할 수 있도록 하는 데 사용됩니다.
이 튜토리얼의 운영 환경: Windows7 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.
CSS3 속성을 사용해 본 학생들은 각 브라우저마다 CSS3 속성을 접두어로 붙여야 한다는 것을 알고 있습니다. 지금도 여전히 접두어를 붙여야 하는 속성이 많이 있습니다. 왜 이런가요?
브라우저 제조업체에서는 이전에도 CSS3를 구현해 왔지만 아직 진정한 표준이 되지는 않았습니다.
CSS3의 많은 속성이 아직 결정되지 않았기 때문에, 표준 사양이 아직 공개되지 않았고, 많은 브라우저가 지원 수준이 다르며, 각 브라우저 제조업체는 동일한 스타일에 대해 서로 다른 작성 방법을 지원하므로 접두사를 추가해야 도달할 수 있습니다. 향후 사양이 통일되면 접두사를 작성할 필요가 없습니다.
css3 접두사는 특정 브라우저 렌더링 엔진에서 이 속성이 인식되고 효과적일 수 있도록 하기 위해 사용됩니다.
prefix | browser | kernel |
---|---|---|
-ms- | IE 브라우저 | Trident 커널 |
-moz- | Firefox | 게코 코어 |
- o- | Opera | Presto kernel |
-webkit- | Chrome 및 Safari | Webkit kernel |
생략할 수 있는 비공개 접두사가 많지만, 이전 버전의 브라우저와 호환되기 위해, 여전히 개인 접두사 및 표준 방법을 사용하고 점진적으로 전환할 수 있습니다.
초기 단계에서 둥근 테두리 반경을 작성하려면 다음과 같이 작성해야 합니다.
.box { border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; }
이것은 이전 버전의 작성과의 호환성을 위한 것입니다. 속성으로 인해 사용자 경험이 감소합니다. 새 버전의 브라우저는 직접 쓰기를 지원합니다: border-radius.
접두사를 사용하면 하위 버전의 브라우저에도 잘 매칭되어 스타일이 정상적으로 표시될 수 있습니다.
(학습 영상 공유: css 영상 튜토리얼)
위 내용은 css3 앞에 접두어를 붙여야 하는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!