분류 전체보기129 Javascript 변수와 데이터 변수란?데이터의 종류변수와 데이터의 차이를 이해했다. 변수는 데이터를 담는 박스의 개념.변수를 선언하고 값을 입력하지 않거나, 이름이 잘못된 경우 console에서 확인할 수 있다. 오류를 찾는 방법. undefined혹은 error로 표시.null의 쓰임이 뭘까? 초기화할 때 사용한다는 부분이 잘 이해되지 않는다.변수란?데이터를 저장하고, 읽고 쓸 수 있는 장소. 데이터를 저장하는 박스의 개념.변수를 활용해 데이터 중복 제거 및 재사용이 가능. 변수 만들기 var 변수이름 = 데이터; 여기서 var는 변수 선언을 의미하는 키워드이다. 변수를 여러개 만들때var를 이용해 여러줄로 나누어 변수를 구분 var 변수이름1 = 데이터; var 변수이름2 = 데이.. 2022. 5. 17. CSS3 flexible box layout display flex속성을 이용해 요소들을 배치하는 방법주축과 교차축을 기준으로 요소를 정리하는 방법flex-direction 속성을 이용해서 주축과 교차축을 바꿀 수 있다. 이를 이용해서 가로로 혹은 세로로 정렬할 때 float보다 편하게 정렬이 가능하다.flex-direction reverse는 어디에 쓰이는걸까? 굳이 순서를 반대로 해서 정렬할만한 경우가 있는지?flexible box layout플렉스 컨테이너(flex container) : 배치할 요소들을 묶어주는 역할.플렉스 항목(flex item) : 플렉스 컨테이너 안에 위치하는 배치할 요소.주축(main axis) : 플렉스 컨테이너 안에서 요소들을 배치하는 기본 방향. 왼쪽(주축 시작점)에서 오른쪽(주축 끝점)으로 수평방향 →교차축(c.. 2022. 5. 16. 0510 코딩노트 2022. 5. 10. CSS display 속성 display:none과 visibility:hidden의 차이display:block과 display:inline-block의 차이display:none 화면에 보이지 않는 것뿐아니라 공간도 차지하지 않는다. (특정 요소를 hover상태에서 노출되도록 할때 사용할 수 있다. )visibility:hidden는 어디에 사용하는가?display 속성화면 보여주는 방식display:none; 화면에서 숨김. 화면에 보이지 않는 것뿐아니라 공간도 차지하지 않음 (삭제의 개념)display:block; 블록레벨요소로 만듬.display:inline; 인라인 레벨로 만듬 / 주로 목록에서 사용 /박스 모델 값이 적용 안됨.display:inline-block; 인라인 레벨로 배치 + 블록 레벨 속성 지정.[화면에.. 2022. 5. 8. 0506 코딩 노트 2022. 5. 7. CSS속성 transition 시간에 따른 속성 적용 transition-delaytransition-durationtransition-propertytransition-timing-function transition-timing-function 을 이용해서 자연스럽게 효과를 줄 수 있다. ease-in-out transition이란? 시간에 따라 웹 요소의 스타일 속성이 변함transition : transition 속성을 한번에 설정transition-delay: 트랜지션 지연 시간 설정transition-duration : 트랜지션 진행 시간 설정 / [시간]transition-property : 트랜지션 대상을 설정 / [all], [none], [속성 이름] transition-timing-function : 트랜지션 속도 곡선을 설정속도 곡선 종.. 2022. 5. 6. CSS 애니메이션 애니메이션 속성을 이해한다.애니메이션을 이용해 요소를 이동시킨다.애니메이션을 이용해 시간차 효과를 줄 수 있다.애니메이션을 이용해 움직임의 속도를 조절할 수 있다.%단위로 키프레임을 지정할 수 있다. 이를 이용해 더 동적인 무빙을 만들어낼 수 있다.애니메이션을 반복할 경우, animation-delay 가 처음에만 적용되는데, 반복 될 때마다 지연되도록하는 방법은?애니메이션이란?CSS3의 animation 속성을 사용하여 자바스트립트나 플래시 없이 웹요소에 애니메이션을 추가할 수 있다. Keyframes : 애니메이션이 바뀌는 지점을 @keyframes 속성을 이용해 정의. from : 애니메이션의 시작 프레임를 설정함to : 애니메이션의 끝 프레임를 설정. @keyframes keyframesName .. 2022. 5. 5. 0504 코딩노트 html/css 2022. 5. 4. 0503 코딩노트 html/css 2022. 5. 3. 이전 1 ··· 9 10 11 12 13 14 15 다음