본문 바로가기

분류 전체보기41

flex기초 과정 복습 [파일과 폴더] - 파일과 폴더이름을 작성할 때는 호스팅을 위해 영문으로 작성한다. - 띄어쓰기 없이 작성해야 호스팅할 때 문제가 없다. * 호스팅이란, 서버에 업로드 하는 것 [그리드] - 화면이 작은 사용자를 위해 적절히 크기를 조정하고 중앙으로 정렬한 상태에서 그 안에서만 디자인하는 용도 - 보통은 고정형사이트에서 작게 사용하지만 심미적인 요소로 반응형에서도 작은 그리드를 사용하기도 한다. [block, flex-container] - 브라우저에서 도형 취급 받는 요소이다. - width: auto = 100%으로 작동한다. - hieght: auto = 0으로 작동한다. - 크기가 아무리 작아도 한 줄에 한 개씩 배치된다. [auto = 0] - 하위 요소 크기만큼 크기를 가지겠다는 뜻. - he.. 2024. 4. 9.
페이지네이션 커스텀 [페이지네이션 커스텀] : 코드펜 페이지네이션 커스텀 ... codepen.io 스와이퍼 홈페이지 들어가서 start -> 가장 하단 demos -> 페이지네이션 선택 -> preview클릭 -> (오른 마우스 클릭) 페이지 소스 보기 (*ctrl+U) 가지고 온 구조 주석 처리 후 정리하기. [js에서 헷갈리는 부분 부연설명 (문자형에 대한 내용임.)] [ 가장 많이 하는 실수 ] 1. 변수 안에다가 변수를 넣는다. -> (변수 바깥에 넣어야함.) 2. 문자인데 ""를 안 넣어서 문자형을 안넣어준다. -> 문자형에 꼭 '', "", ``를 사용하기. 3. 배열함수에 ;세미콜론을 안 넣어준다. -> (세미콜론은 무조건이다.) 4. [ ]대신에 ()를 쓴다. -> [ ]를 꼭 써주어야 한다. 2024. 4. 5.
웹3)자바스크립트 : 스와이퍼 [스와이퍼 셋팅] : 코드펜 스와이퍼 불러오기 스와이퍼 사이트 접속 - 스타트 js-> 상단 부분의 direction바꾸기 [스와이퍼 레이아웃 구성하기] : 코드펜 1. 스와이퍼 전체적인 구조 시작 전체를 지워놓고, 구조 짜 놓은 후 스와이퍼를 넣어야 하는 박스 안에 스와이퍼 구조를 넣는 형식으로 구현. * 이미지엔 스크롤바가 포함되어 있지 않지만 스크롤바까지 포함임.. [데모버전으로 구현하기] : 코드펜 js 에서 필요한 부분만 따와서 사용하기. 반응형 때 사용하는 개념 중 , 너비를 max로 사용 * max-width: 0부터 ~px까지 사용 가능하다는 뜻. [스와이퍼 버튼 커스텀] : 코드펜 - 기본셋팅 : 개발자 모드에서 css 속성값 가지고 와서 주석처리해두기.(코드값 보기 편하게 정리해두면 좋.. 2024. 4. 4.
자바스크립트 기초 - 반복문 반복문 (for, while) 1. [for반복문] for () { } 1.초기값을 지정하고 2.조건이 트루이면 3.코드를 실행하고 4.괄호 3번째 작업 진행, 5.조건 확인하고 6.코드를 실행하고 7.증가시켜줌 8.조건을 확인해서 9.false이면 반복문 빠져나옴. 코드펜 이동 2. [while]반복문 코드펜 이동 [do..while]반복문 while과 비슷한데 조건문을 아래로 옮길 수가 있다. 1. 코드를 실행하고 2. (조건문) 조건문을 체크한다. 차이점 - 적어도 1번은 실행한다는 것이 while과의 차이점임. tip : 명확한 횟수가 정해져있으면 for문을 그게 아니라면 while를 사용함. 반복문을 빠져나오는 방법 break : 만나는 순간 해당 코드를 멈추고 빠져나옴. 코드펜 이동 conti.. 2024. 3. 31.