분류 전체보기 133

CSS에 대해 공부해 봅시다!- 04. 14가지의 선택자들

선택자(selector) 1. type 선택자 - HTML 요소의 태그 이름을 이용해 스타일을 적용합니다. - 예를 들어, p 선택자는 모든 태그에 스타일을 적용합니다. 2. id 선택자 - # 기호를 사용하여 정의됩니다. - ID 선택자는 특정 요소의 ID 속성을 기반으로 스타일을 적용합니다. - 예를 들어, #wrap는 요소를 선택합니다. 3. class 선택자 - .(마침표) 기호를 사용하여 정의합니다. 4. 전체 선택자 - * 기호로 표현합니다. - 문서 내의 모든 요소를 선택하며, 다른 선택자와 함께 사용하여 특정 요소를 선택할 때 유용합니다. 5. 하위 선택자 - 하위 선택자는 부모 요소 안에 있는 자식 요소를 선택하는 선택자입니다. - 하위 선택자는 부모 요소와 자식 요소 사이에 공백을 사용..

Archive/CSS 2023.02.24

CSS에 대해 공부해 봅시다!-03. float에 대하여...

float - float 라는 단어는 원래 ‘뜨다’ 라는 의미이며, 웹페이지에서 이미지를 어떻게 띄워서 텍스트와 함께 배치할 것인가에 대한 속성입니다. - float 속성은 원래 이미지와 텍스트 배치 용도로 등장했지만, 레이아웃용으로 많이 사용하고 있습니다. - 복잡한 형태의 레이아웃을 구성하는데 필요한 핵심 속성으로 특정 요소를 떠있게, 흐르도록, 부유하게 하도록 하는 속성입니다. - 여기서 떠 있다(float)는 의미는 요소가 기본 레이아웃 흐름에서 벗어나 요소의 모서리가 페이지의 왼쪽이나 오른쪽에 이동하는 것입니다. - 아래 사진의 float의 간단한 예시 사진입니다. - float 속성값은 다음과 같습니다. left : 요소를 왼쪽 방향으로 부유하게 설정 right : 요소를 오른쪽 방향으로 부유..

Archive/CSS 2023.02.24

Javascript를 공부해 봅시다! - 04. 조건문!

조건문(conditional statements) 이란 - 프로그램 내에서 주어진 표현식의 결과에 따라 별도의 명령을 수행하도록 제어하는 실행문입니다. - if 문과 switch 문이 있습니다. - 어제 저희가 만들었던 홀짝 프로그램이 if 문을 사용하여 만들었던 것입니다. if 문 - if 문은 if 다음에 소괄호를 사용해서 조건을 표기합니다. - 조건을 체크한 후 결과값이 true이면 실행하고 false이면 if문을 건너뛰고 그 다음 명령을 시행합니다. - 기본형식은 if(조건문){ 조건이 true일 때 실행할 명령}; 입니다. - if 문 안 if 문을 중첩 또는 다중으로 쓸 수 있습니다. 그림출처 if...else문 - if 문과 같이 사용할 수 있는 else 문은 if 문의 표현식 결과가 거짓(..

Archive/Javascript 2023.02.24

Javascript를 공부해 봅시다! - 03. 반복문(feat. 홀짝구분프로그램)

반복문이란? - 같은 동작을 여러번 실행하기 위해 사용하는 문법입니다. - 불필요하게 여러 명령을 늘어놓지 않아도 명령을 반복 실행할 수 있습니다. - 그만큼 소스 코드도 깔끔해지고 프로그램 실행도 더 빨라집니다. for 문 - 자바스크립트에서 가장 많이 사용하는 반복문 입니다. - 조건에 들어가는 값이 일정하게 커지면서 명령을 반복 실행할 때 편리합니다. - 기초화식 - 조건식 - 실행문장 - 증감식 순서대로 실행이 되는 것을 이해해야합니다. - 조건식이 거짓이어서 실행문장이 실행되지 않을 때 for문의 반복이 끝나게 됩니다. - for 문 안에 for 문이 들어갈 수 있습니다. 이것을 중첩 for문 이라고 합니다. 이미지출처 HTML 삽입 미리보기할 수 없는 소스 - for 문을 이용하여 배열의 값을..

Archive/Javascript 2023.02.23

04. 섹션과 관련된 태그들

섹션이란 - , , 등과 같이 구조를 잡는데 보편적으로 많이 쓰이는 시멘트 태그들을 말합니다. 1. - html5에 새롭게 추가된 요소로서, 웹 문서 맨 윗부분에 있으며 웹 사이트 이름, 글로벌 링크(로그인, 회원가입, 사이트맵, 언어 선택 등 웹사이트 어느 곳에서든지 이용할 수 있는 링크)등으로 구성된 영역입니다. 2. - 문서의 본문 영역을 표시합니다. - 본문 영역은 실제 콘텐츠가 표현되는 공간이며, 이 공간에서 사용자와의 상호작용이 실질적으로 이루어집니다. - 또한 body요소는 브라우저가 렌더링해야 할 범위를 알려줍니다. 3. - HTML5에 새롭게 추가된 요소로서, 목적지로 이동할 수 있도록 링크를 별도로 모아둔 영역입니다. 4. - 해당 문서의 요소의 주 콘텐츠(main content)를 정..

Archive/HTML 2023.02.22

Javascript를 공부해 봅시다! - 02. 연산자의 종류

연산자란 - '3 + 5', '3 < 5'와 같은 프로그램에 필요한 수식을 만들 때 필요한 것이 연산자 입니다. - 연산자의 종류에는 산술 연산자, 대입 연산자, 비교 연산자, 논리 연산자, 비트 연산자, 삼항 연산자 등이 있습니다. 산술 연산자 - 사칙 연산을 다루는 가장 기본적이면서도 많이 사용하는 연산자입니다. 산술 연산자의 종류 속성 설명 + 더하기 연산을 할 때 사용합니다. 문자와 문자, 문자와 변수 등을 연결할 때 사용합니다. - 빼기 연산을 할 때 사용합니다. * 곱하기 연산을 할 때 사용합니다. / 몫을 구 할 때 사용 합니다. % 나머지를 구할 때 사용 합니다. ++ 1씩 증가시킬 때 사용합니다. -- 1씩 감소시킬 때 사용합니다. 대입 연산자 - 변수에 값을 대입할 때 사용하는 이항 연..

Archive/Javascript 2023.02.21