분류 전체보기

css 따라하기 2일 차 | font

font로 시작하는 속성s font-size: ; 글자 크기 font-weight: ; 글자 두께 font-style: ; 글자 기울기 font-family: ; 글꼴(서체) 1. font-size - 글자 크기를 줄이거나 키울 수 있고 기본값은 16px이다 - 사이즈 단위로는 px, em, rem 등이 있다 1. font-size | 예시 코드 font-size: ; 글자 크기 font-size:16px; 기본 글자 크기 font-size:12px; 글자 크기 font-size:20px; 글자 크기 단위 em은 기준이 되는 글자의 크기에 대해 ~배를 의미. (1em=16px이나 상위요소의 변화에 따라 같이 달라짐) font-size:1em; 글자 크기. font-size:0.75em; 글자 크기 fon..

JSP 따라하기 2일 차 | request

request - 전달받은 값(요구된 값)을 request(요구, 부탁)를 써서 사용 할 수 있다. - 해당 request를 사용하려면 get이나 post방식으로 값을 연결 받아야 사용할 수 있다. form - form안에 태그들의 name을 정하고 submit하면 안에있는 태그들의 name을 변수명으로 값을 들고 action에 지정된 문서로 넘어간다. - 넘어가는 방식에는 get방식과 post방식이 있고 method속성으로 지정가능 하다(기본값은 get방식) - post방식으로 넘어가면 UTF-8이 깨지기 때문에 request.setCharacterEncoding("UTF-8"); 을 사용해야 한다 get - html문서의 주소칸에 데이터들을 넣어서 보내는 방식 get | form의 예시코드 - 해당 ..

JSP 따라하기 1일 차 | 주석 지시어 선언문 스크립틀릿 표현식

JSP 주석 - 사용법(-- --) - 업로드 했을 때 HTML에서도 보이지 않음 (HTML 주석은 보이지만 JSP주석은 HTML에 보이지 않는다) 지시어(디렉티브) - 사용법(골뱅이[@]) - 웹페이지에 대한 설정 정보를 지정할 때 사용된다 지시어 설명 page JSP 페이지에 대한 정보를 지정합니다. JSP가 생성하는 문서의 타입, 출력 버퍼의 크기, 에러 페이지 등 JSP 페이지에서 필요 정보를 입력 taglib JSP 페이지에서 사용할 태그 라이브러리를 지정합니다. include JSP 페이지의 특정 영역에 다른 문서를 포함 (다른 html, jsp 파일을 현재 웹페이지에 띄워주는 역할) 선언문 - 사용법(느낌표[!]) - 전역변수나 메서드를 선언할 때 사용된다. - 해당 블럭에서는 JSP의 내장..

css 따라하기 1일 차 | 3가지 사용법, 선택자와 선언부, 우선순위

css 3가지 사용법 외부 스타일 시트 내부 스타일 시트 인라인 스타일 1. 외부 스타일 시트 - 외부에서 스타일 시트를 만든 뒤 .html이나 .jsp등의 파일에서 사용 할 수 있다. - 외부 스타일 시트.css 파일을 만든 뒤 head태그 사이에 link태그를 이용하여 참조한다 - 예시 코드 2. 내부 스타일 시트 - 내부 스타일 시트는 head태그 사이에 style태그를 이용하여 선택자와 선언부로 css스타일을 정의한다. test.html - 예시코드 - 결과 창 3. 인라인 스타일 - 인라인 스타일은 HTML 태그 안의 속성에 style속성을 사용하여 선언부로 스타일을 정의한다. test.html - 예시 코드 - 결과창 선택자와 선언부 - 선택자(Selector)에는 tag 선택자, class ..

JavaScript 따라하기 8일 차 | 실습_회원 가입

join_form.html 회원가입 이름 ID 비밀번호 비밀번호확인 주민번호 - E-Mail @ 직접입력 naver.com gmail.com nate.com 직업 항목을 선택하세요 개발자 DB엔지니어 관리자 기타 성별 남 여 취미 여행 독서 게임 전체선택 가입동기 check_id.html ID 중복 체크

JavaScript 따라하기 7일 차 | 내장 객체 window location history document

window 객체 - 자바스크립트에서 미지 정의하여 제공하는 내장 객체 중 최상위 객체 - 웹브라우저의 창(browser window) 자체를 가르키는 용도로 사용됨 - window 객체명은 생략이 가능함 => ex) window.open() => open() 형태로 사용 가능 window 객체 예제 //#1. window.open("새 창에서 접속할 URL", "창이름", "창옵션(크기, 위치 등)") window.open("http://www.itwillbs.co.kr", "창이름", "width=300,height=300"); // 새 창 열기 window.close();// 현재 창 닫기 // window 객체의 innerHeight 와 innerWidth 속성에 접근하여 창의 ..

JavaScript 따라하기 6일 차 | 객체 { : }

객체란? - 객체는 다양한 데이터를 하나의 단위로 묶어서 구성한 자료구조(Data Structure)이다. - 자바스크립트는 객체 기반 프로그래밍 언어이며 객체는 자바스크립트의 거의 모든것을 구성한다. var 변수명 = { 키1 : 값1, 키2 : 값2, ...생략... 키n : 값n } 객체 예시 // 사용자 정의 객체 - person 객체 정의 // => 객체의 이름(= 변수명)을 person 으로 지정하고 // 중괄호 내부에는 person 객체가 가질 수 있는 속성들을 키:값 의 형태로 명시 var person = { name : "이연태", // name 속성에 "이연태" 라는 문자열이 저장 gender : "남", // gender 속성에 "남" 이라는 문..

JavaScript 따라하기 5일 차 | 이벤트 input onclick, etc...

Input 이벤트 - 클릭이나 입력 시 이벤트에 대한 처리를 수행하는 기본적인 방법 - HTML에서 자바스크립트를 건드리는 방법 => input 태그의 type="button" 이나 type="text" 속성 뒤에 이벤트속성명="자바스크립트함수()" 속성 종류 - button - 1. onclick="" => 버튼 클릭 시 ""안의 자바스크립트가 실행됨 - 2. ondblclick="" => 버튼 더블 클릭 시 ""안의 자바스크립트가 실행됨 - 3. onmouseover="" & mouseenter="" => 버튼 위로 마우스가 들어올 시 ""안의 자바스크립트가 실행됨 - 4. onmouseout="" & mouseleave="" => 버튼 밖으로 마우스가 나갈 시 ""안의 자바스크립트가 실행됨 속성 종..

JavaScript 따라하기 4일 차 | 함수 function

함수 - 특정 기능을 수행하는데 필요한 코드들의 모음 - 반드시 호출을 통해서 사용 - 함수 호출 시 전달하는 값을 "전달인자(Argument)" 라고 함 - 함수 정의 시 전달인자를 전달받아 저장할 변수를 "매개변수(Parameter)" 라고 함 - 함수 작업이 끝난 후 호출한 곳으로 되돌아 갈 때 전달하는 값을 "리턴값(Return value)"라고 함 function 함수이름([매개변수선언...]) { // 외부로부터 함수가 호출되면 실행할 코드들... [return [값];] } 함수 예시 // #1 전달인자 X, 리턴값 X // showMessage() 함수 정의 => 전달인자가 없는 형태의 함수로 정의 function showMessage() { // 전달인자가 없..

JavaScript 따라하기 3일 차 | 배열 Array

배열(Array) - 복수개의 데이터를 연속적인 공간에 저장하는 객체(자료구조) - 변수와 달리 한 번에 여러 데이터를 저장(관리) 기능 - 배열에 저장되는 데이터 공간은 인덱스(index)라고 하는 번호를 붙여서 관리 => 인덱스 번호는 자동으로 부여되며 [0]부터 시작하여 [배열크기-1]까지 부여됨 // [ 배열 선언 기본 문법 ] let 배열명 = []; //#1 let 배열명 = new Array(); //#2 //=> 주로, 1번 형태를 많이 사용하며, 1번 형태를 그대로 사용하지 않고 대괄호 내에 초기값 지정 let 배열명 = [값1, 값2, ..., 값n]; //#3 => n개 만큼의 공간을 할당받아 자동으로 데이터를 저장함 => 각 항목은 콤마(,)로 구분 // [ 배열 접근 기본 문법 ]..