Front-End/개념6 margin 과 gap margin: 개별 요소 간에 원하는 곳에 자유롭게 간격을 줄 수 있습니다.gap: flex나 grid 레이아웃에서 자식 요소 간에 균일한 간격을 적용할 때 사용됩니다.gap은 display: flex 또는 display: grid에서만 작동합니다. 만약 상위 컨테이너가 제대로 flex 레이아웃으로 설정되지 않았다면 gap이 적용되지 않을 수 있습니다. 따라서 부모 컨테이너에 display: flex가 적용되어 있는지 다시 확인해야 합니다. 로그아웃 로그인 회원가입 .. 2024. 9. 29. float flex gird 태그 float왼,오른쪽으로 지정해 div를 띄울 수 있다.float는 flex 보다 고전적인 방식이므로 모든 브라우저에서 float 방식으로 화면 구성 가능 flexfloat과 다르게 부모 - 자식 관계로 동작한다.반응형 디자인 gridflex 처럼 부모-자식 관계로 동작 flex와 grid의 차이flex는 1차원 정렬 (가로, 세로 만 정렬이 가능)grid는 2차원 레이아웃 만들기 가능, 컬럼과 로우 동시에 설정가능(가로한칸, 세로두칸) 우월한 것은 없다 만들고 싶은 페이지를 제일 잘 구현할수만 있으면 그걸로 OK 2024. 9. 25. [HTML] p 태그와 input 태그 시작하기Fetch API를 사용해서 프론트에 입력된 데이터를 서버에 보내서 데이터를 수정하게 하는 기능을 만드는 중이다. where절에 userCode가 들어가야지 데이터 조건을 통과해 수정이 되는 쿼리인데, 쿼리가 오류없이 잘 돌았는데도 데이터 수정이 안되는 상황이 생겼다. 그래서 일단 프론트의 값을 다 받아오는지 확이하려고 log.info 로 찍어봤더니 userCode 값을 가져오지 못하고 있었다... 알고보니 원래 나는 태그에 userCode를 value 속성에 정의해서 js에서 받아서 서버로 보내려고 했는데 p태그는 valuer 속성을 사용하는게 안됐던 것이었다... 그래서 input 태그로 바꾸고 value 에 정의를 하니 값이 바로 들어가졌다..! ( input, textarea 같은 폼.. 2024. 9. 21. [Node.js] 버전 중요성 내가 사용하고 싶은 Template 을 적용하던 중 템플릿에 적용된 모든 pakage.json 내용을 한줄 한줄 체크하면서 적용하고 npm install을 실행해 필요한 의존성을 모두 다운받으려 했는데 자꾸 충돌이 일어나는 것이었다..C:\Users\----\OneDrive\Desktop\ProjectCollection\src\main\frontwst>npm installnpm warn deprecated osenv@0.1.5: This package is no longer supported.npm warn deprecated source-map-url@0.4.1: See https://github.com/lydell/source-map-url#deprecatednpm warn deprecated npm.. 2024. 6. 12. 이전 1 2 다음