web sprit
css로 투명도를 설정하는 방법과 그 밖의 유용한 Tip 정보를 알려드리기 위해 늦은 시간을 활용하여 끄적여(?) 보겠습니다. 일반적으로 저는 모를 사항 이었습니다만... 우리가 투명도를 주기 위해서는 CSS의 opacity라는 속성을 사용합니다.접근성을 고려하여 아래와 같은 순으로 작성합니다. 1234567.box{ -ms-filter:alpha(opacity=0); /* IE8 */ filter:alpha(opacity=0); /* IE5 ~ 7 */ opacity:0; /* IE9+, chrome4.0+, firefox2.0+, safari3.1+, opera9.0+ */} Colored by Color Scriptercs 하지만 위와 같이 작성하여 내가 원하는 곳만 투명하게 작업하기 위해선 불만족..
transform 속성은 크게 2가지로 나눌 수 있습니다. 2D Transforms 와 3D Transforms 입니다. 우선 브라우저 서포트 현황을 알아 봅시다. propertiy 크롬 엣지 파이어폭스 사파리 오페라 2D Transforms 36.0 ~ 4.0 -webkit- 10.0 ~ 9.0 -ms- 9.0 ~ 3.2 -moz- 23.0 ~ 15.0 -webkit- 10.5 -o- 23.0 ~ 15.0 -webkit- 10.5 -o- 3D Transforms 36.0 ~ 12.0 -webkit- 12.0 ~ 10.0 16.0 ~ 10.0 -moz- 9.0 ~ 4.0 -webkit- 23.0 ~ 15.0 -webkit- ※ 정확한 정보가 아닐 수 있으니 문제점 지적 부탁드립니다. ^^ Syntax12..
CSS3 는 아직 표준안에 확정되지 않은 상태에서각 브라우져는 벤더 프리픽스를 제공하여 CSS3 속성을 실험적으로 사용할 수 있게 해 줍니다.브라우져별 벤더 프리픽스는 아래와 같습니다. 웹킷 계열 브라우저 (사파리, 크롬) -webkit- 모질라 (파이어폭스) -moz- 오페라 -o- 인터넷 익스플로러 -ms- CSS3 기본속성기본속성 작성 벤더 프리픽스를 작성할 때 위와 같은 순으로 작성하면 됩니다.그 이유는 추후 CSS3 속성이 표준안으로 변경 되었을 경우 벤더 프리픽스가 붙은 내용은 무시하고 표준 속성만 지원하기 때문 입니다. ex)123456789box{ -webkit-border-radius:10px; -moz-border-radius:10px; -o-border-radius:10px; -ms-..