seop's study seop's study

반복문 반복문을 이용하면 코드를 원하는 횟수만큼 반복하여 실행할 수 있습니다. 반복문에는 while문과 do while문 for문이 있습니다. while문 while문은 조건식을 만족할 때까지 코드를 여러 회 반복하여 실행할 수 있습니다. while문은 조건식을 만족할 때까지 중괄호 {...} 안에 있는 코드를 반복하여 실행합니다. while문의 실행 순서는 1.조건식을 검사하고, 만족하면 2.중괄호 안에 있는 코드와 증감식을 실행합니다. 그리고 3.다시 조건식을 검사합니다. 기본형 var 변수=초깃값; while(1. 3. 조건식){ 2. 자바스크립트 코드; 증감식; } 적용 예제 while문의 조건식 i

조건문 조건문은 조건식의 값이 참(true)인지, 거짓(false)인지에 따라 자바스크립트 코드를 제어합니다. 조건문의 종류에는 if문, else문 그리고 if else문이 있습니다. if 문 if문은 조건식을 만족(true)할 경우에만 코드를 실행합니다. 조건식은 Boolean() 내장 메서드와 마찬가지로 그 어떤 데이터를 입력해도 true 또는 false를 반환합니다. 기본형 if(조건식){ 자바스크립트 코드; } 적용 예제 var num=10; if(num

와이어 프레임 와이어프레임(’골격’이라고도 함)은 제품을 구성하는 서로 다른 레이아웃을 정적인 로우 피델리티 상태로 재현한 것으로, 간단한 모양만을 사용하여 인터페이스를 시각적으로 묘사한 것입니다(와이어프레임은 이름에서 알 수 있듯이 와이어로 설계된 모양입니다). 와이어프레임은 구조(페이지 요소의 구성 방식), 콘텐츠(페이지에 표시될 내용) 및 기능(인터페이스의 작동 방식)을 설명하는 데 사용됩니다. 핵심은 와이어프레임이 미래에 대한 스토리라는 점입니다. 와이어프레임을 통해 디자인 팀은 디자인의 현재 진행 상태, 향후 비전, 작업 경로 등을 서로 공유할 수 있습니다. 와이어 프레임을 제작하는 목적 와이어프레임은 디자이너가 작업을 시작하고 크리에이티브 팀의 작업 방향을 설정하는 기초 역할을 합니다. 와이어..

그리드 시스템 그리드 시스템(Grid System)에서 ‘Grid’는 격자나 바둑판 모양의 눈금을 뜻하며 일반적으로는 수직과 수평으로 면이 분할된 것을 의미합니다. 그리드 시스템은 디자인의 레이아웃에 규칙을 부여하는 수단입니다. 편집디자인(인쇄물)에서 시작해 현재 웹 개발 분야에도 적용하여 웹 페이지를 제작하는 기초 단계에서 그리드 시스템을 사용하면 제작을 쉽고 빠르게 진행할 수 있습니다. 그리드 시스템의 장점 디자인 레이아웃은 모든 측정값이 동일한 규칙을 따르면 자동으로보다 일관된 UI를 얻게 됩니다. 그리드 시스템은 균일한 요소와 간격을 사용하여 플랫폼, 환경 및 화면 크기에 일관성을 부여하고 그래픽 요소의 체계적인 배열을 도와줍니다. 또한 협업의 목적으로 내부의 기준을 정하는 것에 도움이 되며, 또..

연산자 연산자란 프로그래밍 언어에서 계산하는 작업을 의미하는 기호들 입니다. 연산자에는 산술, 문자 결합, 대입(복합 대입), 증감, 비교, 논리, 삼항 조건 연산자가 있습니다. 빼기, 더하기, 곱하기, 나누기, 비교 등 을 하는 일련의 작업을 연산 작업 이라 합니다. 산술연산자 산술 연산자에는 더하기(+), 빼기(-), 곱하기(*), 나누기(/), 나머지(%)가 있습니다. 산술 연산자로 연산을 하기 위해서는 연산 대상 데이터가 반드시 2개 있어야 합니다. 산술 연산자의 종류와 기본형 종류 기본형 설명 + A+B 더하기 - A-B 빼기 * A*B 곱하기 / A/B 나누기 % A%B 나머지 논리 연산자 논리 연산자에는 ||(or), &&(and), !(not)이 있으며, 논리 연산자는 피연산자가 논리형데이..

CSS 색상 표현 방법 색상 이름으로 표현 색상의 이름을 바로 입력하여 사용이 가능합니다. p { color: red; } RGB 색상값으로 표현 RGB 색상표기법은 rgb(red, green, blue)형식으로 색상을 표현하는데, 각 요소에는 0에서 255사이의 숫자를 입력합니다. 여기에 투명도를 더하고 싶다면 rgba(red, green, blue, alpha)형식으로 네번째 자리에 불투명도를 표기해주면 됩니다. 투명도 표기법은 0~1까지 사용할 수 있고, 숫자가 적을수록 투명해 집니다. p { color: rgba(0, 0, 0, 0.5); //투명도 50% 검정색 } 16진수 색상값으로 표현(HEX) RGB 순서대로 16진수로 변환하여 00~ff까지 두자리씩 표기합니다. 여섯자리의 색상코드 앞에는..

시맨틱 태그 시맨틱(Semantic)은 "의미의, 의미론적인"이라는 뜻으로 의미를 가지는 태그가 시맨틱 태그입니다. 즉, HTML5에 도입된 시맨틱 태그는 개발자와 브라우저에게 의미있는 태그를 제공하게 됩니다. 종류 태그는 머리말 영역으로 문서 또는 섹션의 헤더를 나타낼 때 사용합니다. 태그는 내비게이션를 나타낼 때 사용합니다. 태그는 문서의 주요 컨텐츠를 나타낼 때 사용합니다. 태그는 사이드에 위치하는 공간을 나타낼 때 사용합니다. 태그는 주제별 그룹의 컨텐츠 섹션을 나타낼 때 사용합니다. 태그는 문서 본문 중 독립된 콘텐츠(개별 뉴스 기사, 게시물)를 나타낼 때 사용합니다. 태그는 꼬리말을 나타낼 때 사용합니다. 태그는 컨텐츠 작성자나 사이트 소유자의 정보등을 부가적으로 담을때 사용합니다. 태그는 제..

데이터 타입(자료형) 변수에는 여러가지 유형이 들어갈 수 있습니다. 프로그램 언어에 있어 가장 기본적인 요소이며, 데이터 타입이라고 합니다. 데이터 타입에는 숫자, 문자열, 논리값, 특수값, 심벌, 객체, 함수 등을 표현할 수 있습니다. typeof typeof는 지정한 데이터 또는 변수에 저장된 자료형을 알고 싶을 때 사용합니다. typeof 변수 또는 데이터; 숫자(Number) 숫자형(Number) 데이터는 단어 의미 그대로 숫자를 의미합니다. 만약"100"과 같이 큰따옴표가 숫자를 감싸고 있다면숫자가 아닌 문자형 데이터 입니다. 이 경우에는 Number("100")를 이용하면 문자형 데이터를 숫자형 데이터로 바꿀 수 있습니다. var 변수=숫자; 또는 Number("문자형 숫자"); var s=1..

자바스크립트 선언문 선언문은 자바스크립트 코드를 작성할 영역을 선언하는 것이라고 이해하면 됩니다. 라는 태그로 종료된 곳까지를 스크립트 영역이라고 부릅니다. 선언문은 태그 영역 또는 태그 영역에 선언하면 됩니다. 자바스크립트 주석처리 자바스크립트 선언문 안에서 코드가 아닌 설명글을 넣고 싶을 때는 주석 처리를 하면 됩니다. 이때 한 줄 주석일 경우에는 '//한 줄 설명글'로 작성하고 여러줄 주석일 경우에는 '/*여러 줄 설명글*/'로 작성하면 됩니다. 코드 입력시 주의사항 1. 자바스크립트는 대ㆍ소문자를 구분하여 작성합니다. 날짜 객체 생성: New date(); (X) 날짜 객체 생성: new Date(); (O) 2. 코드 한 줄을 작성한 후에는 세미콜론(;)을 쓰는 것이 좋습니다. 세미콜론을 쓰지 ..

Block구조 와 Inline구조 블록 구조(block) 블록 요소는 일단 기본적으로 줄 바꿈이 일어나는 형태로 영역의 너비가 상위 영역의 전체 너비만큼 만들어지는 형태입니다. 블록 요소에는 일부를 제외한 블록 요소를 포함하고, 인라인 요소까지 포함 가능합니다. block 요소 div, p, h1~h6, ul, li, ol, table, form, section, footer, address, article, aside, blockgquote, canvas, dd, dl, hr, header, pre, video등 block은 height와 width값을 지정 할 수 있다. block은 margin과 padding을 지정 할 수 있다. 인라인 구조(inline) 인라인 구조는 주로 텍스트를 주입 할 때 ..