스타일 시트 CSS 접두어 -webkit-, -moz-, -ms-, -o- 의미

웹에서 CSS를 적용할 때 webkit, moz, ms, o접두어가 속성앞에 붙은 것을 종종 보실 수 있을 겁니다. 크로싱 브라우저를 위해서 필요하기 때문이고, 주로 쓰이는 브라우저는 IE, 크롬, 파이어폭스, 오페라, 사파리가 있습니다. 우리나라에서는 크롬과 파이어폭스만 적용하면 무난하게 처리가 가능합니다.

 

브라우저 별 접두어

• -webkit- : 구글, 사파리 브라우저에 적용.
• -moz- : 파이어폭스 브라우저에 적용.
• -ms- : 익스플로러에 적용. (생략 가능)
• -o- : 오페라 브라우저에 적용.

 

사용방법

selecter {
    background:-webkit-linear-gradient(to bottom, skyblue, white 50%);
    background:-moz-linear-gradient(to bottom, skyblue, white 50%);
    background:-ms-linear-gradient(to bottom, skyblue, white 50%);
    background:-o-linear-gradient(to bottom, skyblue, white 50%);
    background:linear-gradient(to bottom, skyblue, white 50%);
}

브라우저 별로 적용할 스타일을 작성해 주고 맨마지막의 기본속성을 실행해 줍니다. 조금 번거롭더라도 사용자들의 편의를 위해 브라우저 별로 스타일을 지정해주는 것을 습관화 해두는게 좋습니다.