728x90 300x250 SMALL Front-end323 브라우저 지원 여부 확인 사이트 계속 새롭고 편하고 화려한 기술들이 나오고 있는데 새로운 기술들을 쓰자니 브라우저마다 가능한 기술이 다르기 때문에 지원을 하는지 확인이 필요할때가 많은데요 오늘은 내가 사용할 기술을 어떤 브라우저에서 지원하는지 지원여부를 한눈에 확인할 수 있는 사이트 소개 하겠습니다. https://caniuse.com/ Can I use... Support tables for HTML5, CSS3, etc caniuse.com caniuse라는 사이트인데요 상단에 확인하고 싶은 기술을 입력을 하면 예를들어서 텍스트에 그림자 효과를 주는 text-shadow를 입력해 보면 아래와 같이 사용가능한 브라우저들을 확인 할 수 있습니다. 빨간색으로 표시된 버전은 지원하지 않는다는 뜻이고 초록색은 지원 가능 노란색으로 표시된 부.. 2021. 11. 20. px을 %로 계산하는 방법 px을 %로 계산하는 공식 자식태그(px) / 부모태그(px) = 결과값 결과값 * 100 = %(퍼센트) 참고로 px을 em으로변경할때는 아래의 사이트에 들어가면 자동으로 계산해 준다. PXtoEM.com 2021. 11. 19. vw 계산기 http://publishing.kr/vw/ VW 계산기 publishing.kr 2021. 11. 18. css로 화살표 모양 만들기 > 이런 ">" 모양의 화살표는 자주 사용 되는데 간단하게 css로 만들 수 있습니다. .arrow:after { content: ''; display:inline-block; width: 0.8rem; height: 0.8rem; margin-left: 0.5rem; border-top: 0.1rem solid #333; border-right: 0.1rem solid #333; transform: rotate(45deg); } 먼저 boarder만 있는 네모를 만든다고 생각하고 border 값을 top과 right만 준 상태에서 transform:rotate(45deg);를 이용해서 45도 회전 시켜주면 아래와 같은 모양을 만들 수 있습니다. transform css Browser Support 2021. 11. 17. 이전 1 ··· 52 53 54 55 56 57 58 ··· 81 다음 728x90 반응형 LIST