분류 전체보기374 [JavaScript] 이벤트핸들러 ( BOM ) [JavaScript] 이벤트 핸들러 ( DOM ) [JavaScript] 자바스크립트 이벤트 핸들러 [JavaScript] 자바스크립트 기본 2 [JavaScript] 자바스크립트 기본 [HTML, CSS] CSS 문법 FLEX Flex 참고 사이트 CSS Flex 완벽 가이드 CSS Flex는 효율적인 레이아웃 설계를 hong-study.tistory.com BOM ( Browser Object Model ) BOM은 앞 선 DOM 문서에서 한 번 소개했듯이 브라우저 객체 모델이라 하고, 내장 객체들을 의미한다. window, location, history, document 등이 포함된다. BOM은 자바스크립트의 두 번째 강력한 기능이다. window 객체는 웹브라우저에 대한 전반적인 정보 취득이나.. 2024. 3. 7. [JavaScript] 이벤트 핸들러 ( DOM ) [JavaScript] 자바스크립트 이벤트 핸들러 [JavaScript] 자바스크립트 기본 2 [JavaScript] 자바스크립트 기본 [HTML, CSS] CSS 문법 FLEX Flex 참고 사이트 CSS Flex 완벽 가이드 CSS Flex는 효율적인 레이아웃 설계를 위한 기술로, 컨테이너 내 항목의 공간 hong-study.tistory.com 이벤트 핸들러의 종류는 BOM과 DOM이 있는데, 해당 문서는 DOM을 먼저 다룬다. BOM ( Browser Object Model ) BOM은 브라우저 객체 모델로, 내장 객체를 의미한다. ▶ window, location, history, document 등이 포함된다. DOM ( Document Object Model ) DOM은 문서 객체 모델로, .. 2024. 3. 7. [JavaScript] 자바스크립트 이벤트 핸들러 [JavaScript] 자바스크립트 기본 2 [JavaScript] 자바스크립트 기본 [HTML, CSS] CSS 문법 FLEX Flex 참고 사이트 CSS Flex 완벽 가이드 CSS Flex는 효율적인 레이아웃 설계를 위한 기술로, 컨테이너 내 항목의 공간 배분과 정렬을 유연하게 관리 hong-study.tistory.com 이벤트 핸들러 이벤트 이벤트란 화면에서 클릭이나 동작이 발생하는 동적인 기능이다. ▶ 자바 스크립트의 첫번째 강력한 기능이며, 사용방법만 암기한다면 충분히 적용이 가능하다. 태그와 스크립트의 이벤트를 연결하는 방식 ( 이벤트 앞에 ON 을 붙인다 ) 인라인 이벤트 모델 기본 이벤트 모델 표준 이벤트 모델 이벤트 종류 인라인 이벤트 모델 인라인 이벤트 모델은 HTML 요소에 직접 .. 2024. 3. 6. [JavaScript] 자바스크립트 기본 2 [JavaScript] 자바스크립트 기본 [HTML, CSS] CSS 문법 FLEX Flex 참고 사이트 CSS Flex 완벽 가이드 CSS Flex는 효율적인 레이아웃 설계를 위한 기술로, 컨테이너 내 항목의 공간 배분과 정렬을 유연하게 관리합니다. 이를 통해 반응형 디자 hong-study.tistory.com 함수(선언적 함수) 자바스크립트에서 함수는 1급 최상위 함수이다. 객체지향 프로그래밍 언어에서 메서드의 기능보다 훨씬 더 많은 기능을 담당한다. 선언적 함수 반환 유형은 적지 않으며 매개변수도 적지 않을 수 있다. 매개 변수는 데이터 타입을 적지 않는다. 리턴은 적어도 되며 적지 않아도 된다. 선언적 함수는 함수 선언 이전에 호출하여도 에러를 발생시키지 않는다. 익명 함수 익명 함수는 변수에 .. 2024. 3. 6. [JavaScript] 자바스크립트 기본 [HTML, CSS] CSS 문법 FLEX Flex 참고 사이트 CSS Flex 완벽 가이드 CSS Flex는 효율적인 레이아웃 설계를 위한 기술로, 컨테이너 내 항목의 공간 배분과 정렬을 유연하게 관리합니다. 이를 통해 반응형 디자인 레이아웃이 쉬워 hong-study.tistory.com 자바스크립트 자바스크립트란 프로토타입 기반의 객체 지향 언어이다. 스크립트 언어의 특성 상 플랫폼에 독립적이며 모든 웹 브라우저에서 동일한 실행 결과를 얻을 수 있다. 프로그램 코드가 직접 html 문서에 삽입, 브라우저에서 html 파일을 읽을 때 같이 해석되고 실행된다. 클라이언트에서만 실행 ▶ 정보를 서버에 보낼 필요 없이 처리가 가능하다. Type Check 가 철저하기 않다. ▶ 즉, 변수들의 타입에 있어서.. 2024. 3. 6. [HTML, CSS] CSS 문법 FLEX Flex 참고 사이트 CSS Flex 완벽 가이드 CSS Flex는 효율적인 레이아웃 설계를 위한 기술로, 컨테이너 내 항목의 공간 배분과 정렬을 유연하게 관리합니다. 이를 통해 반응형 디자인 레이아웃이 쉬워지고 복잡한 계산 없이도 요소를 원하 www.heropy.dev FLEX 레이아웃을 구성할 때 float, position을 사용하지만, flex문법을 통해서도 레이아웃을 구성할 수 있다. ▶ flex layout은 부모박수에 flex를 선언하고, 내부에 자식 박스들을 유연하게 배치하는 속성이다. Container 적용 속성 display flex-direction flex-wrap justify-content align-items align-content 자식박스(item)에 적용하는 속성 orde.. 2024. 3. 2. [HTML/CSS] CSS 기초문법 2 [HTML, CSS] CSS 기초문법 [HTML/CSS] HTML 태그 태그 앞서 HTML은 Hypertext Markup Language의 줄임말로 하이퍼텍스트를 작성하기 위해 개발되었다. ▶ 웹 문서를 만들기 위한 기본적인 웹 언어이다. ▶ 하이퍼링크(참조)를 통해 문서 hong-study.tistory.com display 속성 display 속성은 태그의 영역 표현 방식을 지정하는 속성으로 매우 중요한 속성 중 하나이다. none 키워드를 사용하면 태그가 완전히 화면에서 제거된다. block 키워드를 사용하면 태그가 한 줄을 차지한다. inline 키워드 또는 inline-block 키워드를 사용하면 한 줄에 들어간다. inline과 inline-block의 차이점은 inline-block은 박스.. 2024. 2. 29. [HTML, CSS] CSS 기초문법 [HTML/CSS] HTML 태그 태그 앞서 HTML은 Hypertext Markup Language의 줄임말로 하이퍼텍스트를 작성하기 위해 개발되었다. ▶ 웹 문서를 만들기 위한 기본적인 웹 언어이다. ▶ 하이퍼링크(참조)를 통해 문서에서 다른 문서로 hong-study.tistory.com CSS 문법과 적용방법 CSS ( Cascading Style Sheets )로 HTML, XHTML, XML 같은 문서의 스타일을 꾸밀 때 사용하는 스타일 시트 언어이다. ▶ HTML 문서로 모형을 만들면 CSS로 모형을 색칠한다고 생각하면 이해가 빠르다. CSS는 글꼴이나, 배경색, 너비와 높이, 위치 등을 지정하고 웹 브라우저, 스크린 크기, 장치에 따라 화면을 다르게 표시할 수 있도록 지정할 수 있다. CS.. 2024. 2. 29. [HTML/CSS] HTML 태그 태그 앞서 HTML은 Hypertext Markup Language의 줄임말로 하이퍼텍스트를 작성하기 위해 개발되었다. ▶ 웹 문서를 만들기 위한 기본적인 웹 언어이다. ▶ 하이퍼링크(참조)를 통해 문서에서 다른 문서로 접근할 수 있는 텍스트이다. 마크업(Markup) 이란 표시하고자 하는 어떤 정보나 기능들을 태그(Tag)라는 형식으로 감싸는 것을 이야기한다. 마크업 언어(Markup Language)란 태그라는 형식으로 둘러진 언어를 말한다. HTML 태그란 태그(Tag) 일반적인 의미에서 식별, 구별 또는 인식을 위해 짧은 크기로 붙여 놓은 것을 말한다. 프로그래밍에서 태그란 표현의 어떤 기능의 수행을 지시하는 짧은 낱말과도 같다. 제목 글자 태그 제목 태그는 웹페이지에서 가장 많은 비중을 차즈하는.. 2024. 2. 29. [HTML/CSS] HTML 태그 태그 앞서 HTML은 Hypertext Markup Language의 줄임말로 하이퍼텍스트를 작성하기 위해 개발되었다. ▶ 웹 문서를 만들기 위한 기본적인 웹 언어이다. ▶ 하이퍼링크(참조)를 통해 문서에서 다른 문서로 접근할 수 있는 텍스트이다. 마크업(Markup) 이란 표시하고자 하는 어떤 정보나 기능들을 태그(Tag)라는 형식으로 감싸는 것을 이야기한다. 마크업 언어(Markup Language)란 태그라는 형식으로 둘러진 언어를 말한다. HTML 태그란 태그(Tag) 일반적인 의미에서 식별, 구별 또는 인식을 위해 짧은 크기로 붙여 놓은 것을 말한다. 프로그래밍에서 태그란 표현의 어떤 기능의 수행을 지시하는 짧은 낱말과도 같다. 제목 글자 태그 제목 태그는 웹페이지에서 가장 많은 비중을 차즈하는.. 2024. 2. 29. 이전 1 ··· 5 6 7 8 9 10 11 ··· 38 다음 반응형