Studyyyyy

보통 input을 꾸미려면 label을 쓰라고 한다. label, ::before, ::after 등등 나도 자주 썼지만 쓸때마다 너무 복잡하다.그래서 요즘은 최대한 간단하게 css의 accent-color를 사용하여 강조색을 변경해 주는 방법을 사용하고 있다. 아래 링크에서 예시를 보면 checkbox 외 range input, process 등등 여러가지에 적용 가능하다.https://www.w3schools.com/cssref/tryit.php?filename=trycss4_accent-color W3Schools online HTML editorThe W3Schools online code editor allows you to edit code and view the result in your b..

https://hianna.tistory.com/438 [Javascript] 사용자 입력을 도와주는 datalist 알아보기태그는 사용자의 입력을 돕기 위해, 콤보박스 형태로 사용자가 추천할 수 있는 선택지를 제공하고, 자동완성 기능을 제공합니다. 1. 태그 알아보기 2. 에 value와 label 추가하기 3. default 값 지정하hianna.tistory.com 태그 뒤에 를 넣어주면 안에 있는 들을 미리 정의된 옵션을 드롭다운 리스트로 자동완성되어 만들어 보여준다.

https://hudecz.medium.com/how-to-create-a-pure-css-toggle-button-2fcc955a8984 How to create a pure CSS toggle button…?My general experience with programming is that you learn new skills and techniques on the job, which can be often painful as one can easily…hudecz.medium.com tailwind ver.

https://zinee-world.tistory.com/468 [CSS] 'fi' letter-spacing ligature(합자) 이슈letter-spacing 을 쓰다가 이상한 글자를 발견했다. fi 가 떨어지지 않고 계속 붙어있는 것이다. Sketch에서도 이와 같은 이슈가 있었다는 걸 알았는데, CSS에서도 동일한 현상이 발견되었다. 근본적인zinee-world.tistory.com  https://blog.jeongtae.com/rem-%EA%B3%A0%EC%B0%B0:root { /* 루트 요소 폰트 사이즈, 상댓값 */ /* 전체 레이아웃의 크기를 150%로 키우기 */ font-size: 150%;}.box { /* 결과 → 16px × 150% × 2.5 = 60px */ ma..

https://velog.io/@jinsunkimdev/%EB%A6%AC%EC%95%A1%ED%8A%B8%EC%97%90%EC%84%9C-tailwindcss-styled-components-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0 리액트에서 tailwindcss + styled-components 사용하기🤔 Tailwindcss? 최근 리액트에 테일윈드를 사용하고 있다. tailwindcss의 장점은 기존의 css가 HTML태그의 classname을 정하고, css파일에서 따로 작성을 해줘야하는 반면에, classname을 정할 필요가 없이 태velog.io https://velog.io/@posinity/%EC%9E%90%EC%A3%BC-%EC%93%B0%EB%8A%94-t..