웹19 [JavaScript] 변수 변수 데이터를 저장할 수 있는 메모리 공간 값이 변경될 수 있음 자바스크립트의 변수는 타입이 없음 let키워드를 사용하여 변수를 선언 var var name = "김사과"; console.log(num); var num = 10; { console.log(num); // 전역변수 num = 10 var num = 20; } console.log(num) // 전역변수 num = 20 var 키워드는 지역변수와 전역변수의 구별이 없다. 선언도 중복하여 할 수 있다. 변수 선언이 유연하지만 복잡하고 긴 코드에서 사용하는 경우 이미 선언한 변수인지 모르고 재선언하는 경우가 생길 수도 있기 때문에 차라리 let을 사용하는 것이 좋다. let let 변수명 = 값; let 변수명; 변수명 = 값; let은 지역변.. 웹/JavaScript 2023. 10. 25. [JavaScript] JavaScript JavaScript란? JavaScript는 웹 페이지에서 복잡한 기능을 구현할 수 있는 스크립팅 또는 프로그래밍 언어이다. JavaScript 특징 객체 기반의 스크립트 언어이다. 대소문자를 구별한다. 원래는 문장 끝에 ;(세미콜론)을 사용한다. 지금은 세미콜론을 생략해도 된다. JavaScript 출력 브라우저에서 바로 출력 브라우저에서 F12 -> 콘솔 사용한 브라우저는 크롬이다. 콘솔창 내에서 명령을 입력하면 동작을 바로바로 확인할 수 있다. 해당 콘솔창은 브라우저마다 지원하는 형식이나 정도가 다를 수 있다. HTML문서에서 출력 HTML 문서 작성을 위해 VScode를 실행한다. 2023.10.08 - [개발/웹] - [HTML] HTML이란 [HTML] HTML이란 HTML HTML은 Hype.. 웹/JavaScript 2023. 10. 20. [CSS] 선택자 선택자( Selectors ) 스타일을 적용하려는 HTML 요소들을 선택하기 위해 사용 선택자의 종류는 다양하다. 예시에는 인라인 스타일을 사용함. 요소 선택자, 전체 선택자 특정 요소가 쓰인 모든 요소에 스타일을 적용한다. *를 사용하여 전체 요소에 적용한다. 요소가 너무 많이있는 경우 클라이언트에 부하를 줄 수 있다. 개별적으로 적용한 스타일은 전체 선택자에 적용한 스타일보다 우선. 요소 선택자 특정 요소가 쓰인 모든 요소에 스타일을 적용 span 요소 strong 요소 ins 요소 div 안에 p 밖에 요소div 안에 p 요소 Result: * 상속 위 예시에 태그 안에 , , 요소에도 에 해당하는 스타일이 적용되었다. 이것은 부모 요소의 속성값이 자식 요소에게 전달된 것이고, 상속이라고 한다. 속.. 웹/CSS 2023. 10. 10. [CSS] CSS란, 사용 유형 CSS Cascading Style Sheets 의 약자 HTML 요소가 화면에 어떻게 보일지 묘사하는 언어 CSS 문법 HTML 인라인 스타일 HTML 요소 내부에 style 속성을 사용하여 적용하는 방법 Result: 내부 스타일 HTML 문서의 사이에 요소를 사용하여 적용하는 방법 CSS를 적용하는 방법 인라인 스타일 내부 스타일 외부 스타일 Result: 외부 스타일 웹 사이트 전체의 스타일을 하나의 파일에서 변경할 수 있도록 적용하는 방법 CSS를 적용하는 방법 인라인 스타일 내부 스타일 외부 스타일 style.css /* style.css 작성일: 2023-10-10 작성자: Caramel Bottle 내용: 외부 스타일 적용 방법 */ h2 { font-size: 50px; } /* h2 요.. 웹/CSS 2023. 10. 10. [HTML] Emmet HTML Emmet Emmet은 HTML, CSS의 빠르고 효율적인 작성을 도와주는 플러그인이다. Emmet은 사전에 정의된 사용 가능한 태그가 따로 없다. 즉 태그에 어떤 이름을 써도 사용이 가능하다. Emmet에는 공백을 사용할 수 없다. 정확하게는 공백은 Emmet을 멈추는 기능을 한다. Nesting Oprators Child: > 상위 태그부터 하위 태그를 > 로 연결하면 순서대로 구조화. div>ul>li Result: Sibling: + +로 연결된 태그들을 같은 레벨에서 생성 div+p+p+div Result: Climb-Up: ^ ^을 사용하면 한 단계 높은 레벨에 위치시킬 수 있다. ^ 미사용 div+div>p>span+p Result: ^ 사용 div+div>p>span+p^bq Re.. 웹/HTML 2023. 10. 9. [HTML] 태그, 오류, 특징 HTML 태그 HTML은 수많은 태그들로 이루어져있다. 위 태그들을 유심히 보면 쌍으로 이루어진 것과 아닌 것이 있다. 시작 태그와 끝 태그를 가지는 것이 보통이다. 끝 태그가 없는 태그를 빈 태그라고 한다. , 등등... HTML 오류 HTML에서 오타가 나거나 끝 태그를 작성하지 않으면 어떻게 될까? 제목2 1. 문단 태그 웹/HTML 2023. 10. 9. [HTML] HTML이란 HTML HTML은 Hyper Text Markup Language의 약자이다. HTML은 웹 페이지를 만들기 위한 대표적인 Markup 언어이다. HTML은 요소들로 이루어져 있다. 아래는 vscode에서 ! + ⏎ 를 입력하면 나오는 기본 구조이다. 문서의 유형을 나타낸다. 이는 HTML5 임을 나타낸다. 이전 버전의 경우 훨씬 길고 복잡한 문장으로 구성되어 있다. * HTML 4.01의 유형 선언 은 문서의 루트 요소이다. 아래는 W3C HTML 튜토리얼 페이지의 의 일부이다. 태그의 사용 예시를 확인할 수 있다. 의 경우 문서의 제목을 정의하고 브라우저 탭의 이름으로 표시된다. 을 작성하지 않으면 아래와 같이 표시된다. 타이틀은 즐겨찾기에 추가되거나 검색 엔진 결과로도 사용되기 때문에 적절하고 의.. 웹/HTML 2023. 10. 8. 이전 1 2 다음