벤더 프리픽스

속성을 지정할때 값을 보면 —moz, -webkit 등의 글자가 써 있는 경우가 있습니다. 이는 벤더 프리픽스 라고 불리는 것입니다. 벤더 프리픽스는 공급업체 접두사 라는 의미 입니다.

벤더 프리픽스는 웹 브라우저 공급 업체(마이크로소프트, 모질라, 구글, 애플, 오페라)에서 제공하며, 실험적인 기능이 필요할때 사용합니다.

프리픽스란?

CSS의 공급업체 접두사는 모든 브라우저에서 아직 완전히 지원되지 않는 실험적 또는 비표준 기능을 활성화하기 위해 CSS 속성에 추가된 브라우저별 접두사입니다. 공급업체 접두사의 목적은 개발자가 최신 CSS 기능을 표준화하기 전에 사용할 수 있도록 하고 기능이 가장 유용하고 널리 사용되는 표준 기관에 피드백을 제공하는 것입니다.

공급업체 접두사는 일반적으로 “-webkit-“, “-moz-“, “-ms-“ 및 “-o-“와 같이 CSS 속성 이름의 시작 부분에 추가되는 문자 집합입니다. 예를 들어 “border-radius” 속성이 표준화되기 전에 “-webkit-border-radius” 속성은 Safari 및 Chrome과 같은 WebKit 기반 브라우저에서 요소에 둥근 모서리를 추가하는 데 사용되었습니다.

공급업체 접두사는 향후 브라우저 버전에서 지원된다는 보장이 없으므로 개발 단계에서 임시 솔루션으로만 사용해야 한다는 점에 유의해야 합니다. 모범 사례로서 개발자는 공급업체 접두사가 붙은 버전과 함께 속성의 표준 버전을 항상 포함해야 속성이 표준화되면 모든 브라우저에서 작동합니다.

브라우저 접두사

이전에 브라우저들이 새로운 CSS3 속성을 인지하지 못하여 부분적으로만 구현할수 있는 당시에 CSS3 속성을 사용하기 위해서 속성 이를 앞에 브라우저를 식별할수 있는 접두사（prefix)를 붙여서 사용하였습니다.

• -webkit- : 웹키트 방식 브라우저용（사파리, 크롬 등）
• -moz- : 게코 방식 브라우저용（모질라. 파이어폭스 등）
• -o- : 오페라 브라우저
• -ms- : 마이크로소프트 인터넷 익스플로어