분류 전체보기 113

조건을 달아 실행하는 조건문 if문

if문이란? 프로그래밍에서 가장 기본적인 조건문 중 하나입니다. 조건이 참(True)인 경우에만 실행 합니다. 만약 조건이 거짓(False)이라면 실행되지 않습니다. let num = 100; //num에 100이라는 숫자를 저장하였습니다. if(num == 100){ //조건문if에 "num과 100은 같다" 라고 할때 참(true)이면 실행된다. document.write("실행 되었습니다.(true)") //참(true)이여서 "실행 되었습니다.(true)"가 나옵니다. } if문 생략 if문에 "{}"를 생략 하여 더 간결하게 쓸수 있습니다. let num = 100; if(num=100) document.write("실행되었습니다.(true)"); //결과 "실행되었습니다.(true)" else..

JAVASCRIPT 2023.02.25

레이아웃을 만들 때 float 지정 방법과 해제 방법

float 블록 레벨 요소(Block-level Elements)는 원래 마크업을 할때 세로로 나열이 되지만, float을 이용하여 가로로 배치할수 있습니다. float은 레이아웃으 만들기 위한 필수 적인 속성 입니다. 우선 사진은 블록 레벨 요소 중 하나인 에 색깔과 크기를 주어 아래와 같이 여러개의 박스를 만들었습니다. 이처럼 세로로 블록 레벨 요소는 세로로 나열이 되기 때문에 이것을 자연스럽게 배치하기 위해 float을 사용합니다 . float의 속성값 에는 " left " 와 " right "가 있습니다. (자연스럽게 배치하고 싶은 요소에 넣으시면 됩니다.) ※left : 요소를 왼쪽에 배치하고 나머지 요소 들과 자연스럽게 배치 되도록 합니다. ※right : 요소를 오른쪽에 배치하고 나머지 요소..

CSS 2023.02.25

10보다 큰 숫자 찾기,짝수만 더하기

10보다 큰 숫자 찾기 주어진 배열:[1,3,5,7,9,11,13,15,17,19] See the Pen Untitled by jhwangwoo (@jhwangwoo) on CodePen. 풀이: i=0일때 i 10이 성립이 되는 arr[i] 를 보여준다. 사용자에게 1보다 큰 수를 입력하게 한 후 입력한 숫자까지 짝수만 더하는 프로그램 See the Pen Untitled by jhwangwoo (@jhwangwoo) on CodePen. 풀이: 숫자를 num을 입력하면 조건으로 num > 1 이 성립되면 실행되며 실행된 반복문은 i=1이고, i

JAVASCRIPT 2023.02.25

같은 동작을 손쉽게 반복하는 반복문 for문

반복문 같은 동작을 여러 번 실행하기 위해 사용하는 문입니다. 반복문을 사용하면 불필요하게 여러 명령을 늘어놓지 않아도 명령을 반복 실행할 수 있습니다. for문 자바스크립트에서 가장 많이 사용하는 반복문 입니다. for문은 조건에 들어가는 값이 일정하게 커지면서 명령을 반복 실행할 때 편합니다. for문에서는 몇 번 반복했는지 기록 하기 위해 카운터를 사용하고 for문의 첫 번째 항에서 카운터 변수를 지정 합니다. 기본형 for문 for (초깃값; 조건; 증가식) {...} ※ 초깃값: 몇 번 반복할지 지정하기 위해 카운터 변수를 사용하는데, 이 항목에서 카운터 변수를 선언 하고 초기화 합니다. 초기값은 0이나 1부터 시작합니다. ※조건:문장을 반복하기 위해 체크할 조건 부분입니다. 이 조건으 만족해야..

JAVASCRIPT 2023.02.23

섹션(Section)과 관련된 태그들

섹션 (Section)이란? ◎블록 요소 입니다. ◎HTML 문서의 맥락이 같은 요소들을 주제별로 그룹화 해주는 태그 입니다. ◎ 연관된 문서의 단락이 아닌, 일반 컨테이너로 사용하면 안됩니다.(단순한 스타일을 줄 목적으면, 태그를 이용.) ◎섹션주제에 대한 제목 요소 ~을 포함 하는 것이 좋습니다. ◎ 텍스트, 인라인 요소 블록 레벨 요소를 포함 할수 있습니다. 섹션 관련 태그 ◈ · HTML 문서의 주요 콘텐츠 영역을 의미하는 태그 입니다. · 텍스트, 인라인 요소, 블록 레벨 요소를 포함할 수 있습니다. · 태그 안에서 태그를 사용 하면 안되고, 태그 안에서 태그 사용이 가능합니다. ◈ · HTML 문서의 헤더 영역을 의미하는 태그 입니다. · 제목이나 내비게이션, 검색 등의 내용을 포함 ..

HTML 2023.02.22

연산자의 종류

연산자의 종류에는 산술 연산자, 대입연산자, 비교연산자, 논리 연산자 등이 있습니다. 산술연산자 + 더하기 연산을 할때 사용합니다. 문자와 문자, 문자와 변수 등을 연결할 때 사용 합니다. - 빼기 연산을 할 때 사용합니다. * 곱하기연산을 할 때 사용합니다. / 몫을 구 할 때 사용 합니다. % 나머지를 구할 때 사용합니다. ++ 1씩 증가시킬때 사용 합니다. -- 1씩 감소시킬때 사용 합니다. + 연산자는 +를 기준으 로 좌변과 우변에 숫자가 아닌 문자나 변수 등이 오면 더하기 연산이 아닌 연결 연산을 합니다. % 나머지 연산자 는 반복적인 숫자 구간의 패턴 조건문을 이용한 '짝·홀수 판단. 배수 판단' 등의 식을 만드는데 사용하합니다. ++,-- 연산자는 변수의 값을 1씩 증가 시키거나 감소 시키는..

JAVASCRIPT 2023.02.21

ID 선택자 와 CLASS 선택자

ID 선택자 HTML 문서의 요소 중 같은 요소라도 각기 다른 이름을 지정하여 따로 속성을 부여할 수 있습니다. HTML 요소에 "id"로 이름을 붙을 때는 유일한 이름을 부여 해야 하며, 다른 요소에 같은 id명을 주어서는 안된다. See the Pen Untitled by jhwangwoo (@jhwangwoo) on CodePen. 예제를 보면 p태그 중 id 가 'ctxt'인 요소만 색을 파란색으로 표시 하도록 하였습니다. 그리고 id가 'txt'인 p요소는 id만 주어졌을뿐 스타일에 따로 지정된 색이 없어 p요소에 처음 지정된 빨간색으로 표시가 되었습니다. ID 선택자 HTML 문서의 여러 요소 중 같은 이름을 갖는 요소들만 모아 따로 속성을 부여할 수 있습니다. HTML요소에 같은 이름을 부여..

CSS 2023.02.21

CSS를 표현 하는 방법은 내부, 외부, @import, 인라인이 있다.

내부 스타일시트 CSS를 HTML 문서 안에 태그로 기재 하여 HTML 문서 안에 CSS가 함께 저장되도록 하는 형태. 외부 스타일시트 스타일 속성들을 따로 저장하여 HTML 문서에 파일명으로 연결할 수 있습니다. 이때 스타일은 .css확장자를 가진 별도파일로 저장하고, HTML에소는 태그를 이용합니다. 내부 스타일시트는 그 스타일이 기술된 페이지만 적용 하지만, 외부 스타일시트는 그 스타일을 선언한 모든 HTML에 적용됩니다. @import CSS안으로 다른 CSS 파일을 불러들일 경우 사용합니다. 또한 어떤CSS 파일 안에 공통 CSS를 불러들일 경우에도 사용합니다. @import 는 공통으로 들어가야 할 스타일을 따로 저장 하여 다른 CSS에 삽입 시켜 사용할 수 있도록 해줍니다. 그러나 CSS 파..

CSS 2023.02.20

자료형(data type)은 원시 유형과 객체 유형으로 나뉜다

자료형 (data type) 프로그램이 처리할 자료의 형태를 말합니다 . 사람은 숫자나 문자를 보면 그것이 숫자인지 문자인지 바로 알수 있지만, 컴퓨터는 못 알아보기 때문에 그것이 숫자인지 문자인지 이렇게 숫자나 문자열 처럼 프로그램에서 처리할 자료의 유형을 지정해야 하는데 이러한 자료의 형태를 말합니다. 자료형의 관계 자료형은 크게 '원시 유형(primitive type)'과 '객체(object)'로 나뉘어집니다. '원시 유형'은 하나의 값만 저장하는 자료형으로, 숫자와 문자열, 논리형, undefined, null, symbol 유형이 있습니다. 그리고 원시 유형 외에는 모두 '객체' 입니다. 숫자형(number) 보통 C언어나 자바 같은 프로그래밍 언어는 정수와 실수를 구별하여 다른 자료형으로 사용..

JAVASCRIPT 2023.02.20