STUDY

뒤로 가기 앞으로 가기 원하는 페이지 수만큼 이동

input에 값 입력 시 일정 간격을 두고 따라오는 단위를 만들어야 했음 const [number, setNumber] = useState(0); const inputHandler = e => { setNumber(e.target.value); }; return ( ... inputHandler(e)} /> {number ? "kg" : ""} // number state 값과 똑같이 그대로 작성됨 ... ) //scss .input-wrap { position: relative; .input { height: 48px; } .unit { position: absolute; top: 16px; left: 18px; font-size: 14px; } [data-before]::before { content..

IE에서 slick slider 체크 시 overflow: hidden 이 적용되지 않아서 slider 의 모든 요소들이 펼쳐져 보이는 경우가 있었음 IE 11에서는 css3 transform을 적용한 엘리먼트가 부모의 overflow:hidden을 무시하는 현상이 있다고 함 transform 속성을 적용한 엘리먼트에 opacity: 0.99 를 주면 해결됨 https://medium.com/@laziel/windows-8-1-ie-11-%EC%97%90%EC%84%9C-overflow-hidden-%EC%9D%B4-%EB%AC%B4%EC%8B%9C%EB%90%98%EB%8A%94-%EC%96%B4%EB%96%A4-%EA%B2%BD%EC%9A%B0-f322fd5908ae Windows 8.1 IE 11 ..

padding-top 50% - 2:1 padding-top 200% - 1:2 padding-top 75% - 4:3 360 width 720 width 참고 https://happyer16.tistory.com/entry/%EA%B0%80%EB%A1%9C%EC%84%B8%EB%A1%9C-%EB%B9%84%EC%9C%A8-%EC%9C%A0%EC%A7%80%ED%95%98%EB%8A%94-%EB%B0%98%EC%9D%91%ED%98%95-%EB%B0%95%EC%8A%A4 가로세로 비율 유지하는 반응형 박스 반응형 웹디자인에서는 .wrap { max-width: 100%; width: 100%; } 를 활용하여 콘텐츠가 컨테이너의 너비에 맞게 유동적으로 변경되게 하는 기법을 많이 사용한다. 이 때 높이는 ..

사용자에게 고를 수 있거나 추천하는 선택지를 나타내는 option을 여러개 보여줄 수 있는 태그 input list 속성 값 === datalist id 속성 값 select와 다른 점은 사용자가 입력이 가능하고 자동완성 기능을 제공해서 입력된 값으로 option을 빠르게 찾을 수 있음 참고 https://developer.mozilla.org/ko/docs/Web/HTML/Element/datalist - HTML: Hypertext Markup Language | MDN HTML 요소는 다른 컨트롤에서 고를 수 있는 가능한, 혹은 추천하는 선택지를 나타내는 요소 여럿을 담습니다. developer.mozilla.org

1. 시맨틱 마크업 Semantic - 의미론적인 시맨틱 마크업 - 의미를 잘 전달하도록 시맨틱 태그로 문서를 작성하는 것, 웹 페이지의 구조를 명확하게 표현할 수 있다. 각 태그를 그 용도에 맞게 사용해야 한다. 헤더: 푸터: 메인: , 독립컨텐츠: 제목: - ... 네비: 리스트: 과 그 외 블록 요소 안에 인라인 요소 넣기 hgroup 은 큰 거부터 사용하기 br 태그 남발하지 않기 css 는 스타일시트나 별도 코드로 분리해서 사용하기(css 인라인으로 넣지 말기) css 스타일을 명시하는 태그는 적합하지 않음 ex) 글자를 진하게 할때 (스타일 bold)보단 (내용 강조)을 사용해야 함 (기울어진 스타일)

CORS (Cross-Origin Resource Sharing) 개발단계에서 브라우저가 동일 출처 정책(Same origin policy)를 지켜서 다른 출처의 리소스 접근을 막아서 발생 API 연동 시 발생함 해별하려면 크롬의 보안 설정을 변경해야하는데 보안 우려가 있기 때문에 크롬 바로가기를 하나 만들고 거기서만 CORS 가 unblock 되도록 설정함. chrome://flags/#block-insecure-private-network-requests 에 들어가서 설정 disabled 또는 바로가기를 만들고 마우스 우클릭 > 속성 > 대상에서 --disable-web-security 추가하기 "C:\Program Files\Google\Chrome\Application\chrome.exe" --d..

git private organization 탈퇴 시 잔디가 싹 없어짐 해결 방법은 1. Overvier tab > Contribution Setting > private contributions 를 활성화 2. 기여한 리포지토리에서 starred 찍기 하면 탈퇴 후에도 잔디가 잘 뜬다고 한다 별을 안찍어서 그런가 일부 커밋만 표시된다 다음부턴 미리 별 찍기.. https://devsurimlee.tistory.com/49 [Github] 비공개 조직 탈퇴 후 잔디 유지하기 1. Overview > Contribution settings > Private contributions 활성화 2. 자신이 기여한 리포지토리에 스타를 찍는다. 비공개 조직 탈퇴 후 로그인 상태에서 확인해보면 기록이 잘 뜬다. 깃허..