쥬로그

1. 사용하고자 하는 스키마는 더블 클릭하여 Bold 표시되게 한다. 2. SELECT 대표적인 Retrieve 쿼리문 해당 테이블에서 입력된 정보를 불러올 때 사용 SELECT 불러올 컬럼 FROM 테이블 이름; 3. * 테이블의 모든 컬럼을 불러올 때 사용 SELECT * FROM 테이블이름; 4. 주석 처리 /* -- # 5. 수정 alter 6. PK Primary Key 해당 컬럼의 데이터는 "고유 값" 이어야 하고 빈칸 또는 null이 될 수 없다. 테이블 당 PK는 1개인 것이 좋다. 7. NN NOT NULL 해당 데이터 컬럼은 빈 칸이 될 수 없다. 8. UQ Unique 해당 데이터 컬럼은 중복된 값을 넣을 수 없다. 9. AI Auto Increase +1이 자동으로 증가하는 기능 1..

사용자에게 입력받아, 그 수만큼 줄을 출력해 다양한 모양을 만들 수 있다. Scanner() 클래스를 사용하기 위해 public class 밖에서 import java.util.Scanner;를 선언한다. main 메소드 안에서 Scanner 변수 이름 = new Scanner(System.in); 와 변수이름.close(); 를 선언한다. 사용자에게 줄 수를 입력받기 위해 아래 코드를 선언한다. System.out.println("숫자를 입력해주세요."); System.out.print("> "); int 변수 이름 = scanner 변수이름.nextInt(); ① 위에서부터 아래쪽으로 커지는 직각삼각형 만들기 첫 번째 줄에서 별이 1개 두 번째 줄..

여러 데이터를 나열해 표시하고 사용자가 선택할 수 있도록 해 주는 폼 관련 태그들 * 2개 이상의 데이터 나열 • 내용 1 내용 2 ... : 드롭 다운 목록 만들기 : 클릭했을 때 옵션들이 요소 아래쪽으로 펼쳐진다. : 공간을 최소한으로 사용하면서 여러 옵션을 표시하고 싶을 때 사용 • ~ 태그 : 드롭다운 생성 : 기본적으로 한 가지 옵션이 표시되고 화살표를 클릭하면 나머지 옵션이 펼쳐진다. → size 속성 : 화면에 표시될 드롭다운 메뉴의 항목 개수 지정 ! 크롬 브라우저의 경우, 지정한 개수보다 하나 더 많은 옵션이 나타난다. → multiple 속성 : ctrl 키를 누른 상태로 드롭다운 메뉴에 있는 여러 항목 선택 가능 • ~ 태그 : 드롭다운 목록에 표시되는 ..

사용자가 한 줄 짜리 데이터를 입력할 부분을 생성하는 태그이다. 아이디나 비밀번호 등 이메일 주소, 전화번호, 날짜, 시간, 이미지,버튼 등 다양하게 설정 가능 * 사용자 입력 태그 • : 입력 항목 만들기 : 닫는 태그 없음 ✔ type="유형" 속성 : 사용자가 입력할 수 있는 형태 지정 : 모바일 버전 제작 시 필수 요소 → 이메일 주소, 전화번호 등 입력할 때 자동으로 가상 키보드 배열이 변경됨 → hidden : 사용자에게 표시되지는 않지만 서버로 넘겨지는 값 : 사용자에게 굳이 보여 줄 필요가 없지만 관리자가 알아야 하는 것을 히든 필드로 설정한다. → text : 한 줄짜리 텍스트를 입력할 수 있는 텍스트 상자 생성 : 주로 아이디, 이..

사용자가 웹 사이트로 정보를 보낼 수 있는 요소(=form) 태그를 생성해보자. 폼과 관련된 대부분의 작업은 정보를 저장하거나 검색, 수정하는 일이므로 데이터베이스를 기반으로 한다. 폼에 입력된 사용자 정보를 처리하는 것은 ASP, PHP, JSP 와 같은 서버 프로그래밍을 이용한다. * 폼 만들기 • ~ : 사용자가 입력한 자료들을 서버로 어떤 방식으로 넘길 지, 서버에서 어떤 프로그램을 이용해 처리할 것인지 속성 값으로 지정 → method 속성 : 사용자가 입력한 내용들을 서버 쪽 프로그램으로 어떻게 넘겨줄지 지정 ✔ 속성 값 get : 주소 표시줄에 사용자가 입력한 내용이 그대로 드러나므로 보안이 약함 : 글자 수 256byte ~ 4096byte까지의 ..

* 이미지 맵 : 하나의 이미지에 여러 개의링크를 만드는 것 위 이미지에 맵을 생성해보자. 루피의 왼쪽 눈에 뽀로로 홈페이지를, 이빨에 티스토리를 연결하려고 한다. 그러기위해선 눈의 중심 위치, 반지름 길이와 이빨의 왼쪽 상단 위치, 오른쪽 하단 위치의 정보가 필요하다. 위치 정보는 그림판에서 알아낼 수 있다! 1) 원형 영역에 map 생성 2) 사각 영역에 map 생성 * usemap에 # 잊지말고 꼭! 넣자 ✔ 브라우저에서 확인해 보면 생성한 map 부분에 커서를 가져가면 변하는 것을 확인할 수 있다. ✔ 이미지 맵은 주로 메일에서 많이 활용된다. 메일로 보낼 때는, ~ 사이 태그를 복사해서 html 모드에 태그를 붙여 넣어 보내면 된다. 😎 결과물을 확인해보자! 😊 Do it! HTML5 + CSS..

* SVG 이미지란? : Scalable Vector Graphics (스케일러블 벡터 그래픽)의 약자 : 벡터 이미지 (vector image) : 크기를 조정해도 이미지가 깨지지 않고 깨끗이 유지 : 로고, 아이콘, 차트, 다이어그램, 지도 등에 사용됨 : 태그를 이용해 삽입뿐만 아니라 제작까지 가능 → scalable : 확대가 가능하다, 자연스럽게 크기 조절이 가능하다. → 비트맵 이미지 와 벡터 이미지 차이 ▷ 비트맵 이미지 (bitmap image) gif, jpg/jpeg, png 파일 확대 시 이미지 테두리 부분이 울퉁불퉁해짐. 즉, 작은 크기의 이미지를 확대하면 이미지가 깨지는 type ▷ 벡터 이미지 (vector image) svg 파일과 같이 확대 시 이미지..

★ 웹 이미지 형식 ✔ GIF (Graphic Interchange Form) : 표시 가능한 색상 수 최대 256개 : 다른 파일 형식에 비해 용량이 작아 아이콘, 볼릿 등 작은 이미지에 주로 사용 : 투명한 배경 or 움직이는 이미지 제작 가능 ✔ JPG/JPEG (Joint Photographic Experts Group) : 다양한 색상과 명암 표현 가능 : 반복 저장하면 화질이 떨어질 수 있다. ✔ PNG (Portable Network Graphics) : 다양한 색상 표현 가능 : 투명 배경 : 네트워크용으로 개발되어 최근 많이 사용됨

이미지를 클릭하면 다른 문서나 사이트로 넘어가도록 하이퍼링크(hyperlink) 거는 방법 * 이미지 관련 태그 • : 웹 문서에 이미지 삽입 : src 속성을 사용해 파일 경로를 알려 주어야 화면에 표시 가능 → src 속성 : 이미지 파일 경로 지정 ex) 웹 문서와 이미지 파일이 같은 경로에 있는 경우 ex) 웹 문서와 이미지 파일이 다른 경로에 있는 경우 body { ~~-image: url("../파일명/~~~.png"); } ! 파일 경로 한 단계 위로 올라가는 기호 ' .. ' 한 단계 아래로 내려오는 기호 ' / ' ex) 웹 상의 링크를 복사해 이미지 경로 지정 이미 인터넷에 올라와 있는 이미지 링크를 복사해 이미지 경로 지정 ! 웹 이미..

✔ OTF : Open Type Font 의 약자 : 마이크로소프트와 어도비가 개발한 확장자 : 디자인이 중요한 인쇄, 출력 작업에 적합 : 고해상도 : 모든 환경(OS)에서 변형 없이 사용 가능 ✔ TTF : True Type Font 의 약자 : 마이크로소프트와 애플이 개발한 확장자 : 주로 웹 작업이나 문서 작업용으로 적합 : 저해상도 : 폰트 크기에 따라 변형이 있으나 가독성 우수