Front-end/HTML+CSS+JS11 [JS] null VS undefined VS NaN 한 줄 요약undefined : 누락으로 인해 값이 정해지지 않은 경우 JS가 자동으로 부여 null : 개발자가 "명시적"으로 값이 없다는 것을 표현할 때 사용 NaN : 숫자끼리 계산을 했을 때 결과가 숫자가 아닌 경우 (Not a Number) -> 계산 실수나 입력 에러가 있음을 의미 undefined : "이게 빈 건지 인지하지 못했는데..." -> JS가 자동으로 할당let age;console.log(age);null : "이건 빈 값이 들어있어." -> 개발자가 의도적으로 값이 없음을 명시let age2 = null;console.log(age2); NaN : "너 이거 숫자 결과 의도한건데, 연산 결과 숫자 아니야."1. 입력한 값이 숫자만 입력되어야 하는 경우 let age3 =.. 2025. 6. 7. CSS] margin과 padding의 차이 문제 상황아래 폼에서 매물 정보 글자를 조금 더 오른쪽과 아래로 배치하고 싶다.이때 margin과 padding에 대한 이해가 필요하다. margin/padding/border/height/width개발자 도구(F12)를 키면 아래 이미지처럼 margin, padding, border, content 영역이 나온다. 자세한 설명은 아래를 참고하면 된다. margin(주황) : 바깥쪽을 기준으로 떨어뜨린다. 주변 요소와 거리를 두기 위한 영역이다. 위 그림에서 margin을 주면 테두리를 포함한 매물 전체 폼이 이동하게 된다. (바깥쪽에서 움직이는 애 - 보통 container 움직일 때 사용)h1 { margin-top:30px; margin-bottom: 20px; margin-left:150px.. 2024. 10. 3. 10분만에 적용하는 CSS Flex/Container 기본 개념 문제 상황화면 크기를 조금만 줄여도 아래 이미지처럼 웹 페이지가 깨져 보인다. 목표화면 크기에 상관 없이 웹 페이지가 깨지지 않도록 하고 싶다. -> CSS Flex 를 이용한다! CSS Flex /Container기초 이론아래와 같은 코드를 본 적이 있는가? 하이1 하이2 하이3 컨테이너를 하나 만든 것을 flex container 라고 부르고, 컨테이너 안의 요소들을 flex item 이라고 부른다. 조금 더 쉽게 이해하기 위해서는 아래 그림을 살펴보자.어떤 요소들이 컨테이너에 담겨져 있는데, 컨테이너 박스 자체를 flex container 라고 부르고 컨테이너 안의 요소들을 flex item 이라고 부르는 것이다. CSS Container 개념의 핵심은 컨테이너 크기가 늘어나거나 줄어들.. 2024. 9. 29. 이전 1 2 3 다음
