본문 바로가기
728x90
반응형

CSS127

css 만으로 PNG 이미지 색상 바꾸기 https://codepen.io/sosuke/pen/Pjoqqp CSS filter generator to convert from black to target hex color Added License 2022-07-15; this is retroactive for whatever help that is. 0-clause Free BSD License Permission to use, copy, modify, and/or distribute... codepen.io 누군가 만들어둔 위 프로젝트에 들어가서 원하는 색상을 입력하면 filter 값을 만들어준다! 해당 값을 복사해서 원하는 CSS에 아래처럼 넣어주면 끝! .button:hover .arrow { filter: invert(100%) sepia.. 2023. 2. 28.
[zoom] 글씨크기를 더더 줄이고 싶을때 글씨크기가 크롬에서는 10px 이하로는 설정이 안된다... 근데 더 작게 쓰고 싶을때 아래처럼 써주면 10px을 0.8배 축소 시켜준다! 반대로 크기를 더 키우고 싶으면 배수만큼 써주면 된다! 너무 작게 설정하면 너무 작아서 안보임..ㅋㅋ .text{ font-size: 10px; zoom: 0.8; } 참고 https://blog.mydepot.kr/20221007_656#gsc.tab=0 [CSS] font-size를 10px 이하로 적용이 안될 때 – webDev 크롬 외 일부 브라우저는 브라우저 설정으로 최소 폰트 사이즈를 지정하고 있다. 각자 브라우저 설정을 하면 원하는 결과를 얻을 수 있겠지만 그게 불가능 할 경우에는 아래와 같이 적용하면 된 blog.mydepot.kr 2023. 2. 9.
선택자 nth-child 범위 ( n번 부터 n번까지 ) 기본 nth-child 선택자:nth-child(n) // n번 선택자:nth-last-child(n) //뒤에서 n번째 선택자:nth-child(2n) // 2의배수번째 2,4,6,8.......번째들 모두 선택자:nth-child(odd) //홀수번째 모두 선택 선택자:nth-child(even) //짝수번째 모두 선택 범위 선택자:nth-child(-n+6) //1번부터 6번까지 선택자:nth-last-child(-n+6) //뒤에서 1번부터 6번까지 선택자:nth-child(n+6) //6번부터 전부 선택자:nth-last-child(n+6) //뒤에서 6번부터 전부 선택자:nth-child(n+2):nth-child(-n+4) //2번 부터 4번 전까지 테스트 See the Pen Untitle.. 2022. 9. 15.
간단하게 css로 프로그레스바 그리기 css 로 그리고 script 로 숫자 늘리기 See the Pen progressbar by gahyun (@gahyun) on CodePen. [javascript/jQuery] - [JAVASCRIPT/JQUERY]애니메이션 - 숫자가 0부터 점점 커지는 롤링애니메이션 2022. 9. 6.
728x90
반응형