- 전체(91)
- html5(1)
- web accessibility(11)
- Cross Browsing(20)
- html basic(7)
- css basic(23)
- meta(2)
- form(12)
- table(2)
- menu(2)
- box(1)
- button(1)
- font(1)
- etc(8)
- CSS 애니메이션
브라우저 접두어
그런데 css3의 브라우저 접두어에 대하여 별얘기들이 없습니다.
브라우저 접두어는 현재 css3에서 브라우저마다 틀린 렌더링 방식을 지원하기위해 접두어를 사용하는 방법입니다.
접두어 사용방식은 사파리에서 사용하기 위해 웹킷팀이 먼저 개발하고 사용했습니다.
그런데 웹킷팀이 먼저 사용한 접두어가 w3c권고안으로 되면서 파이어폭스,오페라,크롬 등등 진지하게 접두어에 대하여
조사하고 연구한결과 우리도 접두어를 사용하겠다, 현재 안정적으로 구현되기에 지원을 하겠다 발표를 했습니다.
사용법은 간단합니다.
-webkit- 웹키트 계열
-moz- 모질라 계열
-o- 오페라 계열
-ms- ms계열
-khtml- 콘쿼러 계열
-chrome- 크롬 계열
현재 총 6개의 브라우저별 접두어가 있습니다.
그런데 과연 다들 잘 알고 사용 하고 있을까요?
현재 w3c권고 표준안과 브라우저 접두어 의 순서는 아래와 같습니다.
-webkit-transition:
-moz-transition:
-o-trasition:
trasition:
먼저 브라우저 접두어속성을 가장 상위에 써주고 마지막에 표준안을 써주는 것입니다.
현재 css3를 사용하기 위해 접두어를 사용하는 우리는 그저 현재 지원하는 브라우저부터 잘 작동되게끔 해야 합니다.
그러기 위해서는 먼저 지원하는 브라우저부터 순서대로 써주는 것입니다.
나중에 접두어가 사라질 확률이 높을것으로 예상됩니다.
이유는 css3의 표준권고안이 제안에서 최종으로 확정되면 그때는 접두어를 사용할 필요가 없어지기 때문입니다.
최종권고안때는 위와같이 코드를 써놓은부분들이 브라우저마다 인식을 안하고 마지막 표준안만 인식 할 것입니다.
그렇기에 우리는 현재 지원률이 높은 브라우저부터 지원을하고 나중에 표준권고안이 최종으로 되면 마지막으로 인식 될것이기에
미리 문제가 발생되는 사태를 안일어나게끔 하는편이 좋습니다.
사실 현재 브라우저마다 표준으로 지원하는 것들도 있지만 일부 지원이 안되는 것들이 있기에 접두어를 사용하는 이유도 있습니다.
댓글 쓰기 권한이 없습니다.
71 | 웹접근성 지침 | 2016.05.18 |
70 | table colgroup | 2016.05.16 |
69 | [IE] IE의 호환성보기 설정하기 | 2016.05.13 |
68 | 크로스브라우징 | 2016.02.04 |
67 | IE6 버그 정리 | 2016.02.04 |
66 | CSS transition 이해하기 | 2016.02.04 |
65 | 버튼라이이브러리(bootstrap) | 2015.10.19 |
64 | CSS3애니메이션 툴 Sencha Animator | 2015.10.15 |
63 | sss | 2015.09.16 |
62 | 폰트사이즈 계산 | 2015.09.16 |
61 | html 특수문자 | 2015.08.18 |
60 | 브라우저별 핵 | 2015.05.02 |
> | css3의 브라우저 접두어 | 2015.05.02 |
58 | input placeholder line-height 적용 방법 1 | 2015.05.02 |
57 | form요소 css 스타일링 | 2015.05.02 |
56 | button disabled 속성 | 2015.05.02 |
55 | reset 방법 모음 | 2014.11.28 |
54 | word-break | 2014.11.27 |
53 | text-transform | 2014.11.21 |
52 | ime-mode 입력폼의 한영전환 지정하기 | 2014.11.14 |