CSS Vendor Prefixes = CSS browser prefixes (브라우저 접두사)
Web Design/CSS & CSS32018. 4. 14. 18:05
CSS Vendor Prefixes = CSS browser prefixes (브라우저 접두사)
표준화 또는 규격화되지 않은 새로운 CSS 기술을 지원하기 위해 브라우저 제조사에서 제공하는 하나의 방법.
ex) transition
body {
-webkit-transition: outline 10s ease; /* 크롬, 사파리 */
-moz-transition: outline 10s ease; /* 파이어 폭스 */
-ms-transition: outline 10s ease; /* 인터넷 익스플로러 */
-o-transition: outline 10s ease; /* 오페라 */
transition: outline 10s ease; /* 표준 */
}
Vendor Prefix를 사용할 때는 위와 같이 프리픽스 버전을 먼저 선언, 표준 속성(transition: outline 10s ease;)이 가장 마지막에 와야한다.
프리픽스는 결국에는 표준으로 확정될 것이고 그렇게 되면 브라우저는 프리픽스가 붙은 속성은 무시한 채 표준 속성만 지원하게 되기 때문이다.
Vendor Prefix를 자동생성해 주는 사이트를 소개한다.
http://css3generator.com/
- 관련 유용한 사이트 : http://modernizr.com/
'Web Design > CSS & CSS3' 카테고리의 다른 글
CSS Property (속성 ) : Font (0) | 2018.04.16 |
---|---|
CSS Vendor Prefixes (브라우저 접두사)로 부터 자유를... (0) | 2018.04.16 |
CSS - Embedding Styles (HTML에 CSS 적용 방법) (0) | 2018.04.16 |
CSS 3 의 역사와 브라우저별 지원현황 (0) | 2018.04.14 |
CSS[cascading style sheets]: 외부스타일시트 웹페이지 삽입 (1) | 2018.04.12 |