본문 바로가기
반응형

웹-프론트(Web-Front)47

009.자바스크립트 응용문제(짝수홀수/배수찾기) [문제1] 사용자로부터 입력받은 수가 짝수인지 홀수인지 판단해 주는 프로그램을 만드세요. 아래 그림과 같이 출력되도록 하세요. *정답보기(더보기 누르기) 더보기 See the Pen JS_009_응용문제_정답 by wootekken (@wootekken) on CodePen. [문제2] 사용자로부터 자연수 1개(1~100 사이의 값)를 입력받습니다. 1~100 까지 숫자 중에서 사용자가 입력한 숫자의 배수를 모두 표시하고, 그 배수가 총 몇개인지 출력하는 프로그램을 만드세요. 아래 그림과 같이 출력되도록 하세요. *정답보기(더보기 누르기) 더보기 See the Pen JS_009_ by wootekken (@wootekken) on CodePen. 2022. 1. 20.
008.JS_반복을 멈추거나 건너뛰기(break,continue) 반복문을 멈출 때는 break를 사용합니다. 현재 실행되고 있는 반복문을 건너뛰고 반복문의 시작지점으로 다시 돌아가려면 continue를 사용합니다. [예제1] break문으로 반복문 멈추기 See the Pen JS_008_예제1 by wootekken (@wootekken) on CodePen. [예제2] continue문으로 반복문 시작점으로 되돌리기 See the Pen Untitled by wootekken (@wootekken) on CodePen. 위 for문에서 continue가 실행되면, 아래쪽의 코드를 무시하고 for문의 i++로 가서 실행됩니다. i++로 점프하여 실행된 뒤, i < 10를 체크하여 참이면 for반복문을 계속하고, 거짓이면 반복문을 벗어납니다. [퀴즈1] 다음의 조건을.. 2022. 1. 19.
007.자바스크립트 반복문(for,while) [1] for문 예제1 See the Pen JS_007__예제1 by wootekken (@wootekken) on CodePen. 위 코드는 전형적인 for문의 예시 입니다. for(변수 시작값; 변수 비교값; 변수 증감값) 을 이용해서 변수 비교값의 결과가 참(True)이면 for 반복문을 계속 실행하고, 거짓(False)이면 for 반복문을 멈추고 다음으로 넘어갑니다. 아래 그림에 for 문의 실행 순서에 대해 번호가 매겨져 있습니다. (1)~(4)번 순서대로 실행됩니다. (1)은 반복을 시작할 때 보통 만들게 되는 변수의 시작값 입니다. (2) 부분은 참과 거짓을 나타내는 코드입니다. 이 부분이 참일 경우 (3)번을 실행하게 되고, 거짓일 경우 for 반복문을 벗어나( 물결괄호{ }를 벗어나 ).. 2022. 1. 19.
006.자바스크립트 조건문(if, switch) [예제1] if문으로 0보다 큰지 검사하기 if(참/거짓)문은 (괄호) 속에 오는 상태값이 참이면 명령어를 실행하고, 그렇지 않으면 실행하지 않습니다. if(참/거짓)문의 (괄호) 속의 상태값이 거짓이면 else 부분을 실행하게 됩니다. 즉, if~else 구문은 두 개중 하나를 선택해서 실행할 때 사용하는 명령어 입니다. See the Pen JS_006__예제1 by wootekken (@wootekken) on CodePen. [퀴즈1] 다음의 조건을 만족하는 프로그램을 만드세요. 사용자로부터 prompt입력을 받아 age변수에 저장합니다. 변수 age값이 18보다 크거나 같으면 "성인입니다"라고 화면에 출력하고, 그렇지 않으면 "미성년자입니다"라고 화면에 출력되게 하세요. *퀴즈정답(더보기 누르기.. 2022. 1. 19.
[009] 박스모델(block, inline) 콘텐츠 영역의 width(가로 길이), height(세로 길이) 조절하기 박스 모델의 콘텐츠 영역의 크기를 지정할 때는 width(가로길이), height(세로길이) 속성을 사용합니다. width, height 속성값: px(픽셀), cm(센티미터), 백분율(%), auto 등으로 지정할 수 있습니다. width와 height는 좌우 padding과 테두리(border) 두께를 합친 값입니다. [예제1] div박스에 width와 height 적용해보기 아래 코드에서, 빨간 div 박스는 px 고정값으로 설정하여 브라우저 창의 크기와 상관없이 크기가 유지된다. 반면에 파란 div 박스는 % 값으로 설정하여, 부모요소(body), 즉 웹 문서 창의 크기에 따라 달라진다. See the Pen 009_예제1 .. 2022. 1. 7.
[HTML.005] Replit으로 온라인 코딩하기 [HTML.005] Replit으로 온라인 코딩하기 🚩 리플릿(Replit)이란? 리플릿(Replit)은 사용자들이 브라우저를 사용하여 코딩을 할 수 있는 웹 서비스이다. 리플릿에서 코딩을 하기 위해 별도의 프로그램 설치없이 회원가입만 하면 바로 코딩을 할 수 있다. 리플릿은 실시간 채팅 피드를 통한 실시간 다중 사용자 편집 기능을 포함하여 다양한 협업 기능도 갖추고 있다. 리플릿에서는 자바(Java), 파이썬(Python), HTML/CSS/JS, C언어, C++ 등 50개 이상의 프로그래밍 언어를 지원한다. 사용용자가 앱 및 웹 사이트를 만들 수 있고, 이 사이트는 코드 호스팅 플랫폼인 깃허브와 통합되어 있어 깃허브에서 프로젝트를 가져오고 실행할 수 있는 방법을 제공한다. 클래스(Class) 관리 기.. 2022. 1. 7.
[001]CSS란? CSS란? CSS는 Cascading Style Sheets의 약자이다. HTML은 문자나 이미지, 표 같은 요소를 웹 문서에 넣어 뼈대를 만드는 작업이고, CSS는 그 뼈대에 색상이나 크기, 위치, 배치 방법 등 웹 문서의 디자인 요소를 작업할 때 사용하는 언어이다. Cascading: 폭포같은, 계속되는, 연속적인 Style: 스타일의 Sheets: 문서, 종이 HTML vs HTML+CSS CSS를 제거하여 오직 HTML로만 작성된 네이버(Naver)홈페이지를 아래 이미지에서 확인할 수 있습니다. HTML 문서에 CSS를 적용하면 우리가 일반적으로 보는 네이버 홈페이지가 됩니다. 2022. 1. 6.
[HTML.004]HTML이란? [HTML.004]HTML이란? HTML 이란? HTML은 웹 페이지를 만들 때 사용하는 언어로서 단어의 영어 뜻은 다음과 같다. HTML : Hypertext Markup Language (하이퍼텍스트 마크업 언어) Hyper : 초월한, ~ 위의, 엄청난 Text: 문자, 문서 Markup Language: 마크(or 태그) 등을 이용하여 문서의 구조를 표시하는 언어의 한 가지로서, 태그는 원래 글자의 교정부호나 설명을 나타내기 위한 것이었으나 용도가 점차 확장되어 문서의 구조를 표현하는 역할을 하게 되었다. 이러한 태그 방법의 체계를 마크업 언어라 한다. (참고) infra < sub < hypo < ultra < super < hyper hyper- : over, beyond, over much,.. 2022. 1. 6.
[HTML.003] 인터넷이란? 웹이란? [HTML.003] 인터넷이란? 웹이란? 인터넷(Internet)의 개념 인터넷(Internet)이란 여러 통신망을 하나로 연결한다는 의미의 ‘인터 네트워크(inter-network)’라는 말에서 시작되었으며, 이제는 전 세계 컴퓨터들을 하나로 연결하는 거대한 컴퓨터 통신망을 의미합니다. 인터넷(Internet)의 역사 인터넷은 1960년대 미국 국방성에서 군사적인 목적으로 구축한 알파넷(ARPANET)으로부터 시작되었습니다. 이후 데이터의 전송 속도가 빠르고 안정적이게 되면서 더욱 빠르게 발전하게 됩니다. 이러한 소규모 네트워크들이 더욱 발전하고 서로 접속함에 따라 현재는 전 세계적인 거대한 컴퓨터 네트워크의 집합체로 현대인에게 없어서는 안 될 역할을 하고 있습니다. 인터넷의 특징 인터넷은 서로 동시에.. 2022. 1. 6.
728x90
반응형