슬라이드 1

Size: px
Start display at page:

Download "슬라이드 1"

Transcription

1 웹프로그래밍 HTML, 자바스크립트, ASP 를중심으로 제 2 장 HTML 문법

2 목차 제 2 장 HTML 문법 2.1 기본태그 2.2 LINK 태그 2.3 Image 2.4 TABLE 2.5 FRAME 2.6 INPUT 양식 2

3 2.1 기본태크 구조태그 문자서식태그 문단서식태그 3

4 2.1.1 구조태그 HTML 태그들중가장기본이되는태그 <HTML> : HTML 문서의시작을의미함 <TITLE> : 웹브라우저의제목표시줄에표시될내용을작성 <HEAD> : 스타일시트를기술하거나, 각종스크립트언어의함수등을선언하는부분으로사용됨 <BODY> : HTML 문서의실제내용을포함하는부분, 이부분에작성된내용이브라우저에나타남 4

5 2.1.1 구조태그 <BODY> 태그의속성 속성설명 BACKGROUND = 이미지파일명 배경으로사용될이미지파일을지정 BGCOLOR = 색상명 OR RGB값 배경색을지정함 TEXT = 색상명 OR RGB값 문자색을지정함 LINK = 색상명 OR RGB값 링크로설정된문자색을지정 ALINK = 색상명 OR RGB값 링크클릭시변화되는색을지정 VLINK = 색상명 OR RGB값 링크를사용한후의문자색을지정 색상적용방법 BGCOLOR = RED BGCOLOR = #FF0000 5

6 2.1.1 구조태그 구조태그연습 예제 2-1 Structure-Tag.html <HTML> <HEAD><TITLE> HTML 문서의구조태그 </TITLE></HEAD> <BODY BACKGROUND = "BG.GIF" TEXT = "BLACK"> <BR> HTML 은 &LT;HTML&GT;&LT;HEAD&GT; <BR> &LT;TITLE&GT;&LT;BODY&GT; 4 개의구조태그를 <BR> 이용하여구성할수있다. </BODY> </HTML> 6

7 2.1.2 문자서식태그 문자서식태그란글자의모양, 글자의색, 굵은글자, 기울임등다양한문자모양을만들기위한태그임 기본글꼴태그 <FONT> 태그 특수문자표현방법 7

8 2.1.2 문자서식태그 기본문자태그 <B> : Bold의약자로굴은글자를표현함 <I> : 이탤릭체를표현하는데사용함 ( 기울임 ) <S> : 취소선 (strike Through) 을나타내는데사용 <SUP> : 위첨자를나타내는데사용 <SUB> : 아래첨자를나타내는데사용 8

9 2.1.2 문자서식태그 기본문자태그예제 예제 2-2 Font.html <HTML> <HEAD><TITLE> HTML 문서의글꼴태그들 </TITLE></HEAD> <BODY> <BR>&LT;B&GT; : <B>Bold 의약자로굵은글자를표현할때사용한다.</B> <BR>&LT;I&GT; : <I> 이탤릭체를표현하는데사용한다.( 기울임 )</I> <BR>&LT;U&GT; : <U> 글자에밑줄을표시하는데사용한다.</U> <BR>&LT;S&GT; : <S> 취소선 (Strike Through) 을나타낸다.</S> <BR>&LT;SUP&GT; : <SUP> 위첨자를나타낸다.<SUP> <BR>&LT;SUB&GT; : <SUB> 아래첨자를나타낸다.<SUB> </BODY> </HTML> 9

10 2.1.2 문자서식태그 FONT 태그 FONT 태그는문자의다양한속성을바꾸기위해사용됨 < 태그명속성 1 = 속성값 속성 2= 속성값 > 속성설명 SIZE = N 문자의크기를지정함 FACE = 폰트명 폰트모양을지정함 COLOR = 색상명 OR RGB값 문자의색을지정함 SIZE 속성의기본값은 3 으로설정되어있음 10

11 2.1.2 문자서식태그 FONT 태그 다음과같이다양한문자표현이가능함 11

12 2.1.2 문자서식태그 특수문자표현 HTML에서 < 와같은특수문자는이미태그에서사용하기로예약되어있음 특수문자를표현하기위해다음과같은표현을사용하여야함 : 공백 < : < > : > & : & " : 12

13 2.1.2 문자서식태그 특수문자예제 예제 2-6 Special-char.html <HTML> <HEAD><TITLE> 특수문자의표현 </TITLE></HEAD> <BODY> <BR><FONT FACE = "ARIAL"> < </FONT> <BR><FONT FACE = "ARIAL"> > </FONT> <BR><FONT FACE = "ARIAL"> & </FONT> <BR><FONT FACE = "ARIAL"> " </FONT> <BR><FONT FACE = "ARIAL"> 공 백 </FONT> </BODY> </HTML> 13

14 2.1.3 문단서식태그 문단의정렬, 스타일, 문단의문자색상등을한번에적용시키기위한태그 <BR> 태그 <P> 태그 수평선태그 문장인용태그 <PRE> 태그 14

15 2.1.3 문단서식태그 <BR> 태그 줄바꿈태그, 워드프로세싱프로그램에서엔터키와동등한역할을수행함 <BR> 태그는 </BR> 과같은닫힘태그없이단독으로사용됨 앞의예제들을통해많은예제를확인할수있음 15

16 2.1.3 문단서식태그 <P> 태그 문단을바꾸기위해서는 <P> 태그를사용함 <P> 태그는중복으로적용되지않음 <P> 태그는다음장에서배우게될스타일시트를적용할때중요한요소로사용됨 속성설명 ALIGN = LEFT OR CENTER OR RIGHT 문단의정렬모양을지정 16

17 2.1.3 문단서식태그 <P> 태그예제 예제 2-7 Paragraph.html <HTML> <HEAD><TITLE> 문단태그사용법 </TITLE></HEAD> <BODY> <P ALIGN = "LEFT"> 왼쪽정렬입니다.</P> <P ALIGN = "CENTER"> 가운데정렬입니다.</P> <P ALIGN = "RIGHT"> 오른쪽정렬입니다.</P> 이것은 P 태그를줄바꿈태그로사용하는예입니다.<P><P><P> &LT;BR&GT; 두개는 &LT;P&GT; 와비슷하게동작합니다.<BR><BR> 하지만 P 태그는중복되지않습니다. </BODY> </HTML> 17

18 2.1.3 문단서식태그 수평선태그 문장과문장을나누거나페이지의상하구분을나눌필요가있을때사용함 <HR> 태그를사용하며다음과같은속성값을가지고있음 속성설명 SIZE = 픽셀수 수평선의세로길이 ( 굵기 ) 를지정 WIDTH = 픽셀수 OR OO% 수평선의가로길이를지정 ALIGN = LEFT, CENTER, RIGHT 수평선의정렬위치를지정 NOSHADE 수평선의입체감을제거한다. 18

19 2.1.3 문단서식태그 문장인용태그 문서를작성할때, 인용문은특별하게처리해야하는경우에사용 <BLOCKQUOTE> 태그를사용 TAB 키나공백문자를삽입하지않아도자동으로들여쓰기가적용됨 19

20 2.1.3 문단서식태그 문장인용태그예제 예제 2-9 BlockQuote.html <HTML> <HEAD><TITLE>BLOCKQUOTE 태그사용법 </TITLE></HEAD> <BODY> 오늘의명언 <BLOCKQUOTE>The most beautiful thing in the world is, of course, the world itself</blockquote> The most beautiful thing in the world is 세상에서가장아름다운것은물론세상그자체이다. </BODY> </HTML> 20

21 2.1.3 문단서식태그 <PRE> 태그 특수문자또는수식, 공백의사용이빈번한경우매번특수한방법으로표현하기에는사용자에게너무불편함 HTML에서는 <PRE> 태그안의내용은그대로문서에표현하는방법을사용하여위와같은문제를해결하고있음 21

22 2.1.3 문단서식태그 <PRE> 태그예제 예제 2-10 Pre-Tag.html <HTML> <HEAD><TITLE>BLOCKQUOTE 태그사용법 </TITLE></HEAD> <BODY> 보통 HTML 에서는 &LT; 를 &AMP;LT; 으로표시해야하지만 <PRE>PRE 태그안에서는 < 그냥사용해도됩니다.</PRE> </BODY> </HTML> 22

23 2.2 LINK 태그 문서내링크 URL 을이용한문서갂링크 링크 23

24 2.2.1 문서내링크 PDF 문서에서목차를클릭하면해당페이지로이동하게된다. HTML 문서에서위와같은기능을적용하기위해서는문서내링크기능을사용함 문서내 LINK 생성 ( 링크된문자열생성, 이동할 LABLE 지정 ) <A HREF= #LABLE > 링크될문자열 </A> 문서내 LABLE 생성 ( 이동할 LABLE 생성 ) <A NAME= LABLE > 이동할부분의내용작성 </A> 24

25 2.2.1 문서내링크 문서내링크예제 예제 2-11 Doc-Link.html <HTML> <HEAD><TITLE>HYPER LINK - 문서내링크 </TITLE></HEAD> <BODY> <A HREF = "#LABLE1">LABLE1 로이동 </A> <A HREF = "#LABLE2">LABLE2 로이동 </A> <BR><BR><BR><BR><BR><BR><BR> <A NAME = "LABLE1"> 이곳이 LABLE1 부분입니다. <BR><BR><BR><BR><BR><BR><BR> <A NAME = "LABLE2"> 이곳이 LABLE2 부분입니다. </BODY> </HTML> 25

26 2.2.2 URL 을이용한문서갂링크 링크된문자열, 또는문장을클릭하면해당문서로이동하는기능을말함 검색엔짂등에서쉽게볼수있는기능임 검색한정보를확인하고일일이주소를입력하여해당문서로이동할때의불편함을보완하여 HTML 의핵심기능역할을함 태그사용법 <A HREF= URL > 링크될문자열 </A> 26

27 2.2.2 URL 을이용한문서갂링크 URL 링크예제 예제 2-12 URL-Link.html <HTML> <HEAD><TITLE>HYPER LINK - URL 링크 </TITLE></HEAD> <BODY> 홈페이지정보 <BR> <A HREF = " 다음 </A><BR> <A HREF = " 네이트 </A> </BODY> </HTML> 27

28 링크 링크란링크된문자열을클릭하였을때링크된주소로 을젂송할수있는프로그램을실행시키는기능을수행함 일반적으로 OUTLOOK-EXPRESS 를실행시킴 태그사용법 <A HREF= mailto: 주소 > 링크될문자열 </A> 28

29 링크 링크예제 예제 2-13 MAIL-Link.html <HTML> <HEAD><TITLE>HYPER LINK - MAIL 링크 </TITLE></HEAD> <BODY> 메일보내기 <BR> <A HREF = "mailto:kjb123@empas.com"> 김종배 </A> </BODY> </HTML> 29

30 2.3 Image 문서에삽입그림을삽입할때사용하는태그임 삽입그림은문서의젂체적인모양을꾸미거나문서의이해를돕기위해주로사용되는방법임 <IMG> 태그를사용함 태그사용법 <IMG SRC= 경로 / 파일명 속성 = 속성값 > 30

31 2.3 Image 주요속성 속성설명 SRC = 경로 / 파일명 삽입될이미지의파일의위치를지정 WIDTH = 픽셀수 이미지의가로크기를지정 HEIGHT = 픽셀수 이미지의세로크기를지정 ALT = 문자열 이미지에대한설명을기술 ALIGN = LEFT, CENTER, RIGHT 이미지와문자간의정렬위치를지정 HSPACE = 픽셀수 이미지의좌 / 우여백을지정 VSPACE = 픽셀수 이미지의상 / 하여백을지정 31

32 2.3 Image 이미지태그의특징 이미지의경로는젃대경로와상대경로를모두지원함 WIDTH, HEIGHT 속성을지정하지않으면원본사이즈로지정됨 ALT 속성은이미지에마우스를올릮후일정시갂기다리면지정한문장이나타남 32

33 2.3 Image 이미지태그예제 (1) 예제 2-14 Image.html <HTML> <HEAD><TITLE>IMAGE 삽입 </TITLE></HEAD> <BODY> 상대경로를이용한이미지삽입 <BR> <IMG SRC = "IMG.JPG"></IMG><BR> 절대경로를이용한이미지삽입 <BR> <IMG SRC = "C:\2-14\IMG.JPG"></IMG<BR> </BODY> </HTML> 상대경로는현재폴더를기준으로함 젃대경로는사용자마다달라질수있음 33

34 2.3 Image 이미지태그예제 (2) 예제 2-15 Image-size.html <HTML> <HEAD><TITLE>IMAGE 삽입 </TITLE></HEAD> <BODY> 원본사이즈 <BR> <IMG SRC = "IMG.JPG" ALT =" 네잎클로버 "></IMG><BR> 사용자정의사이즈 <BR> <IMG SRC = "IMG.JPG" WIDTH = "50" HEIGHT = "50"></IMG><BR> </BODY> </HTML> 34

35 2.4 TABLE 여러데이터를비교하거나각종데이터의특징, 수량등을기록하기위해표를사용함 HTML 은 <TABLE> 태그를활용하여표를작성할수있고, 표는단순히표뿐만아니라여러용도로사용됨 HTML 문서가 <HEAD>, <BODY> 와같이서브태그를가지고있듯이 <TABLE> 태그는 <TR>, <TD> 등의서브태그를가지고있음 35

36 2.4 TABLE <TABLE> 태그와서브태그 <TABLE> : 표의시작과끝을선언하는태그 <TR> : ROW, 테이블의행을정의 <TD> : DATA, 행의셀을정의 (COL) <TH> : HEADER, 행의셀을강조 <CAPTION> : 표의 CAPTION을지정 36

37 2.4 TABLE <TABLE> 예제 예제 2-19 Table.html <HTML> <HEAD><TITLE>TABLE 생성 </TITLE></HEAD> <BODY> 2 2 TABLE 작성 <TABLE BORDER = "1"> <TR> <TD> 첫번째 </TD> </TR> <TR> </TR> </TABLE> <TD> 두번째 </TD> <TD> 세번째 </TD> <TD> 네번째 </TD> </BODY></HTML> 37

38 2.4.1 <TD> 태그 <TD> 태그의속성 속성설명 ALIGN = LEFT, CENTER, RIGHT 셀의좌우정렬방식을지정 VALIGN = TOP, MIDDLE, BOTTOM 셀의상하정렬방식을지정 ROWSPAN = N N은합칠셀개수 셀의열을합칠수를지정 COLSPAN = N N은합칠셀개수 셀의행을합칠수를지정 WIDTH = 픽셀수 셀의가로크기를지정 HEIGHT = 픽셀수 셀의세로크기를지정 셀병합시병합할수를행, 열에맞게기입하여야표가구성됨 38

39 2.4.2 <TABLE> 태그 <TABLE> 태그의속성 속성설명 BORDER = 픽셀수 TABLE의외각선두께를지정 WIDTH = 픽셀수 OR OO% TABLE의전체가로크기지정 HEIGHT = 픽셀수 OR OO% TABLE의전체세로크기지정 CELLSPACING = 픽셀수 셀과셀사이의여백을지정 CELLPADDING = 픽셀수 셀과문자사이의여백을지정 39

40 2.4.2 <TABLE> 태그 <TABLE> 속성예제 예제 2-21 Table-Spacing.html <HTML> <HEAD><TITLE>TABLE 속성 </TITLE></HEAD> <BODY> TABLE 태그의다양한속성들 <BR> <TABLE BORDER = "2" WIDTH = "600" HEIGHT = "30%" CELLSPACING = "10"> <TR><TD WIDTH = "300">CELLSPACING</TD> <TD WIDTH = "300"> 외각과셀사이 </TD> </TR> </TABLE><BR> <TABLE BORDER = "3" WIDTH = "600 HEIGHT = "30%" CELLPADDING = "10"> <TR><TD WIDTH = "300">CELLPADING</TD> <TD WIDTH = "300"> 셀과셀내용사이 </TD> </TR> </TABLE></BODY></HTML> 40

41 2.4.3 TABLE 정렬 <TABLE> 태그에 ALIGN 속성을활용하면표젂체를문서에알맞게정렬할수있음 예제 2-22 Table-Align.html <HTML> <HEAD><TITLE>TABLE 정렬 </TITLE></HEAD> <BODY> <TABLE BORDER ALIGN ="RIGHT"> <TR><TD WIDTH = "300"> 오른쪽정렬 </TD><TR> </TABLE> <TABLE BORDER ALIGN ="LEFT"> <TR><TD WIDTH = "300"> 왼쪽정렬 </TD><TR> </TABLE> <P ALIGN = "CENTER"><TABLE BORDER> <TR><TD WIDTH = "300">P 태그로정렬 </TD></TR> </TABLE></P></BODY></HTML> P 태그와 TABLE 태그를중첩하여정렬할수도있음 41

42 2.4.4 배경색정의 배경색예제 (1) 예제 2-21 Table-Spacing.html <HTML><HEAD><TITLE>TABLE BGCOLOR</TITLE></HEAD> <BODY> <TABLE BORDER BGCOLOR="RED" ALIGN ="LEFT"> <TR><TD COLSPAN = "2">TABLE 전체 </TD></TR> <TR><TD> 일괄적으로 </TD><TD>RED</TD></TR> </TABLE> <TABLE BORDER ALIGN = "RIGHT"> <TR><TD COLSPAN = "2">2 번째 ROW</TD></TR> <TR BGCOLOR = "BLUE"><TD> 일괄적으로 </TD><TD>BLUE</TD></TR> </TABLE> <TABLE BORDER ALiGN="CENTER"> <TR><TD COLSPAN = "2" BGCOLOR = "BLUE"> 각각의셀 </TD></TR> <TR> <TD BGCOLOR = "YELLOW">YELLOW</TD> <TD BGCOLOR = "GREEN">GREEN</TD> </TR> </TABLE><BR> <TABLE BORDER ALiGN="LEFT" BGCOLOR = "BLUE"> <TR> <TD COLSPAN = "2"> 전체 BLUE</TD></TR> <TR> <TD BGCOLOR = "YELLOW"> 특정셀 YELLOW</TD> <TD BGCOLOR>GREEN</TD></TR> </TABLE></BODY></HTML> 42

43 2.4.4 배경색정의 배경색예제 (2) 43

44 2.5 프레임 (Frame) 문서를구조적으로작성하기위해주로사용 44

45 2.5.1 프레임정의 프레임을생성하기위해서는프레임수 + 1 개의 HTML 파일이필요함 각각의프레임을나타내는 HTML + 구조를정의한 HTML 프레임을정의하기위해서 <FRAMESET> 태그를사용함 프레임구조를정의하는 HTML 파일에는 <BODY> 태그를사용하지않는특징을가지고있음 45

46 2.5.1 프레임정의 <FRAMESET> 속성 속 성 설 명 BORDER = 픽셀수 FRAME의외각선의두께를지정 ROWS = OO% or 픽셀수 FRAME을열로나눔 COLS = OO% or 픽셀수 FRAME을행으로나눔 MARGINHEIGHT = 픽셀수 FRAME의좌우여백을지정 MARGINWIDTH = 픽셀수 FRAME의상하여백을지정 NOSIZE FRAME의사이즈를조절할수없음 SCROLLING = YES or NO FRAME의스크롤여부를지정 <FRAMESET> 예제 ROWS = 100,100 FRAME을상하로 100px 로분할 COLS = 30%,* FRAME을좌우로 30%, 나머지분할 46

47 2.5.1 프레임정의 <FRAMESET> 예제 (1) 예제 2-24 Frameset.html <HTML> <HEAD><TITLE>FRAME SET</TITLE></HEAD> <FRAMESET ROWS = "20%,*"> <FRAME SRC = "TOP.HTML"> <FRAME SRC = "BOTTOM.HTML"> </FRAMESET> </HTML> 상단은윈도우의 20%, 하단은나머지를할당함 상, 하두개의 Frame 을생성한후각각에 TOP.HTML, BOTTOM.HTML 을표시하라 47

48 2.5.1 프레임정의 <FRAMESET> 예제 (2) 예제 2-25 Multi-Frame.html <HTML> <HEAD><TITLE>FRAME SET</TITLE></HEAD> <FRAMESET COLS = "20%,*"> <FRAME SRC = "LEFT.HTML"> <FRAMESET ROWS = "50%,50%"> <FRAME SRC = "TOP.HTML"> <FRAME SRC = "BOTTOM.HTML"> </FRAMESET> </FRAMESET> </HTML> <FRAMESET> 태그를중첩함으로써다양한프레임을만들수있음 48

49 2.5.2 타겟프레임지정 링크기능을사용할때이동할문서를어디에표시할것인가를지정 특별한타겟프레임속성 TARGET = _blank 새로운윈도우 TARGET = _self 현재프레임 TARGET = _top 모든프레임을없애고현재문서 TARGET = _parent 링크가있는프레임에새로운프레임 을생성하고링크된문서를표현 49

50 2.5.2 타겟프레임지정 타겟프레임예제 예제 2-26 타겟프레임지정 Target-Frame.html <HTML> <HEAD><TITLE>TARGET FRAME</TITLE></HEAD> <FRAMESET COLS = "20%,*"> <FRAME SRC = "LEFT.HTML"> <FRAMESET ROWS = "50%,50%"> <FRAME SRC = "TOP.HTML" NAME = "TOP"> <FRAME SRC = "BOTTOM.HTML" NAME = "BOTTOM"> </FRAMESET> </FRAMESET> </HTML> left.html <HTML> <HEAD><TITLE>FRAME SET</TITLE></HEAD> <BODY> 메뉴 <BR> <A HREF=" TARGET = "TOP"> 교수최황규 </A><BR> <A HREF=" TARGET = "BOTTOM"> 교수하진영 </A> </BODY> 50

51 2.5.2 타겟프레임지정 타겟프레임예제 51

52 2.6 INPUT 양식만들기 <FORM> 태그 웹서버로클라이언트의정보를젂달할때어떤범위의데이터 를어떠한방식으로어디에젂달할것인지를결정하는태그 <FORM> 태그속성 속성설명 ACTION = URL 클라이언트의정보를처리할 URL METHOD = GET or POST 정보전달방법 자바스크립트, ASP PART 에서자세히다룸 52

53 2.6 INPUT 양식만들기 <INPUT> 태그 일반적으로 <FORM> 태그안에서사용되며젂달될데이터를입력받기위해사용됨, 단독으로도사용가능함 <INPUT> 태그의 TYPE 속성 속 성 설 명 TYPE = TEXT 문자입력양식을생성 TYPE = PASSWD 문자입력약식을생성 ( 입력되는값을 * 로표시 ) TYPE = CHECKBOX 체크박스를생성 TYPE = RADIO 라디오버튼을생성 TYPE = IMAGE 이미지입력양식을생성 TYPE = HIDDEN 숨겨진입력양식을생성 TYPE = SUBMIT 보내기버튼을생성 TYPE = RESET 취소버튼을생성 53

54 2.6 INPUT 양식만들기 TEXT, PASSWD 예제 2-27 Input-TEXT.html <HTML> <HEAD><TITLE>INPUT TAG</TITLE></HEAD> <BODY> <FORM> ID : <INPUT TYPE = "TEXT" NAME = "ID"><BR> PASS : <INPUT TYPE = "PASSWORD" NAME = "PASSWD" SIZE = 20"> NAME : <INPUT TYPE = "TEXT" NAME = "NAME" SIZE ="6"><BR> <INPUT TYPE = "TEXT" NAME = "MAIL" SIZE = 40" VALUE = "ABC@ABC.COM"> </FORM></BODY></HTML> 54

55 2.6 INPUT 양식만들기 CHECKBOX, RADIO 예제 2-28 Input-Select.html <HTML> <HEAD><TITLE>INPUT TAG</TITLE></HEAD> <BODY> <FORM> <INPUT TYPE = "CHECKBOX" NAME = "C1" VALUE = "1"> 스키 <INPUT TYPE = "CHECKBOX" NAME = "C2" VALUE = "2"> 보드 <INPUT TYPE = "CHECKBOX" NAME = "C3" VALUE = "3"> 인라인 <HR> <INPUT TYPE = "RADIO" NAME ="R1" VALUE ="1"> 스키 <INPUT TYPE = "RADIO" NAME ="R1" VALUE ="2" CHECKED> 보드 <INPUT TYPE = "RADIO" NAME ="R1" VALUE ="3"> 인라인 </FORM></BODY></HTML> 55

56 2.6 INPUT 양식만들기 SUBMIT, RESET 예제 2-29 Input-Submit.html <HTML> <HEAD><TITLE>INPUT TAG</TITLE></HEAD> <BODY> <FORM> <INPUT TYPE = "CHECKBOX" NAME = "C1" VALUE = "1"> 스키 <INPUT TYPE = "CHECKBOX" NAME = "C2" VALUE = "2"> 보드 <HR> <INPUT TYPE = "RADIO" NAME ="R1" VALUE ="1"> 스키 <INPUT TYPE = "RADIO" NAME ="R1" VALUE ="2" CHECKED> 보드 <HR> <INPUT TYPE = "SUBMIT" VALUE =" 보내기 "> <INPUT TYPE = "RESET" VALUE =" 취소 "> </FORM></BODY></HTML> 56

57 2.6 INPUT 양식만들기 <SELECT> 태그 회원가입페이지등에서직업을선택할때처럼이미정해져있는목록중하나를선택하는입력양식 목록을만들기위해서는 <OPTION> 태그를이용 <SELECT> <OPTION> ITEM1 <OPTION> ITEM2 </SELECT> 57

58 2.6 INPUT 양식만들기 <SELECT> 태그예제 예제 2-30 Select.html <HTML> <HEAD><TITLE>SELECT TAG</TITLE></HEAD> <BODY> <FORM> <SELECT NAME = "SPORTS" SIZE = "4"> <OPTION> 축구 <OPTION> 농구 <OPTION> 배구 <OPTION> 족구 <OPTION> 피구 <OPTION> 스키 <OPTION> 수영 </FORM></BODY></HTML> 58

59 2.6 INPUT 양식만들기 <TEXTAREA> 태그 대량의문자열을입력받기위해사용되는입력양식으로한줄에입력받을수있는양과줄수등을속성으로변경함 ROWS, COLS 옵션을활용함 59

60 2.6 INPUT 양식만들기 <TEXTAREA> 태그예제 예제 2-31 Textarea.html <HTML> <HEAD><TITLE>TEXT AREA</TITLE></HEAD> <BODY> <FORM> <TEXTAREA NAME = "INTRO" ROWS = "10" COLS = "50"> </TEXTAREA><P> <INPUT TYPE = "SUBMIT" VALUE =" 보내기 "> <INPUT TYPE = "RESET" VALUE =" 취소 "> </FORM> </BODY> </HTML> 60

Javascript

Javascript 1. HTML 이란? HTML 은 Hyper Text Mark Up Language 의약자로예약되어있는각종태그라는명령어를이용하여웹페이지를작성할때사용하는언어입니다. 2. HTML 의기본구조 < 태그 > 내용 < 태그속성 = 변수 > 내용

More information

PowerPoint Template

PowerPoint Template JavaScript 회원정보 입력양식만들기 HTML & JavaScript Contents 1. Form 객체 2. 일반적인입력양식 3. 선택입력양식 4. 회원정보입력양식만들기 2 Form 객체 Form 객체 입력양식의틀이되는 태그에접근할수있도록지원 Document 객체의하위에위치 속성들은모두 태그의속성들의정보에관련된것

More information

2009년 상반기 사업계획

2009년 상반기 사업계획 웹 (WWW) 쉽게배우는데이터통신과컴퓨터네트워크 학습목표 웹서비스를위한클라이언트 - 서버구조를살펴본다. 웹서비스를지원하는 APM(Apache, PHP, MySQL) 의연동방식을이해한다. HTML 이지원하는기본태그명령어와프레임구조를이해한다. HTTP 의요청 / 응답메시지의구조와동작원리를이해한다. CGI 의원리를이해하고 FORM 태그로사용자입력을처리하는방식을알아본다.

More information

SK Telecom Platform NATE

SK Telecom Platform NATE SK Telecom Platform NATE SK TELECOM NATE Browser VER 2.6 This Document is copyrighted by SK Telecom and may not be reproduced without permission SK Building, SeRinDong-99, JoongRoGu, 110-110, Seoul, Korea

More information

네트워크 명령 실습

네트워크 명령 실습 HTML 실습 Contents 1. WWW, HTTP, HTML 개요 2. HTML 기본구조 3. HTML 기본태그 1. 글자관련 2. 서식관련 3. 표관련 4. 하이퍼링크관련 5. 프레임관련 6. 멀티미디어관련 7. 배경등꾸미기관련 8. 아이템화관련 1. HTML 개요 1. HTML(Hyper Text Markup Language) A. 웹문서를표현하는기술

More information

웹의 뼈대 HTML의 이해 개요 및 텍스트 태그

웹의 뼈대 HTML의 이해 개요 및 텍스트 태그 HTML 의이해 - 개요및텍스트태그 최현종 ( 서원대학교 ) HTML 의개요 웹문서란무엇인가? 인터넷에올려진문서 HTML : 다양한멀티미디어요소까지다룰수있는인터넷표준웹문서 웹브라우저란무엇인가? 웹문서를보기위한프로그램 대표적인웹브라우저 - 인터넷익스플로러 - 넷스케이프내비게이터 - 오페라 그림 1. 인터넷익스플로러 HTML 의정의 - Hyper Text Markup

More information

PHP & ASP

PHP & ASP PHP 의시작과끝 echo ; Echo 구문 HTML과 PHP의 echo 비교 HTML과 PHP의 echo를비교해볼까요

More information

슬라이드 1

슬라이드 1 웹프로그래밍 HTML, 자바스크립트, ASP 를중심으로 제 3 장고급 HTML 작성 목차 제 3 장고급 HTML 작성 2.1 기본태그 2.2 LINK 태그 2.3 Image 2.4 TABLE 2.5 FRAME 2.6 INPUT 양식 2 3 장고급 HTML 작성 멀티미디어파일다루기 스타일시트 레이어 3 3.1 멀티미디어 최근인터넷사용자가급증하면서기업 / 개인용홈페이지가급증하였고다양한홈페이지를만들기위해많은기술들이생겨나고있음

More information

Microsoft PowerPoint HTML.ppt

Microsoft PowerPoint HTML.ppt 웹프로그래밍 () HTML () 2006 년봄학기 문양세강원대학교컴퓨터과학과 웹페이지제작단계및환경 주제와주제와내용선정 어떤어떤내용을내용을담을담을것인지것인지,, 어떤어떤단계로단계로제작할제작할것인지것인지결정결정 디자인디자인 웹페이지페이지구조구조 저작권저작권확인확인 로고로고, 아이콘, 아이콘또는또는멀티미디어멀티미디어등다양한다양한소재를소재를어떻게어떻게꾸밀꾸밀것인지것인지구성구성

More information

PowerPoint Presentation

PowerPoint Presentation WordPress 를이용한웹사이트만들기 2015 년 한지웅 WordPress 를이용한웹사이트만들기 Day 1 Day 2 Day 3 Day 4 Day 5 1. 웹사이트제작기초 HTLM 기본 CSS 기본 WordPress 개론 ( 웹사이트구축툴 ) 2. 웹호스팅 / 웹사이트구축 웹호스팅업체선택 cpanel 설정 WordPress 설치 3. WordPress 기초활용

More information

미쓰리 파워포인트

미쓰리 파워포인트 computer & internet 07. FRAME TAG FRAME? 프레임이란? : 웹페이지를수직이나수평으로여러개영역으로나누어다른웹문서가들어갈수있도록구성할수있음. 이때나누어진각각의창을프레임이라고함. 2 FRAME 문서의구조 HTML 문서에서 태그기능을 프레임문서구조에서는 이대신함 일반웹페이지구조 ..

More information

이장에서다룰내용 테두리를제어하는스타일시트 외부여백 (Margin) 과내부여백 (Padding) 관련속성 위치관련속성 2

이장에서다룰내용 테두리를제어하는스타일시트 외부여백 (Margin) 과내부여백 (Padding) 관련속성 위치관련속성 2 03 장. 테두리여백지정하는속성 이번장에서는테이블, 레이어, 폼양식등의더예쁘게꾸미기위해서 CSS 를이용하여 HTML 요소의테두리속성을바꾸어보자. 이장에서다룰내용 1 2 3 테두리를제어하는스타일시트 외부여백 (Margin) 과내부여백 (Padding) 관련속성 위치관련속성 2 01. 테두리를제어하는스타일시트 속성값설명 border-width border-left-width

More information

PHP & ASP

PHP & ASP 단어장프로젝트 프로젝트2 단어장 select * from address where address like '% 경기도 %' td,li,input{font-size:9pt}

More information

Javascript

Javascript 1. 폼 (Form) 태그란? 일반적으로폼 (Form) 태그는입력양식을만들때사용됩니다. 입력양식이란어떤데이터를받아전송해주는양식을말합니다. 예를들면, 방명록이나게시판, 회원가입등의양식을말합니다. 이러한입력양식의처음과끝에는반드시폼태그가들어가게됩니다. 폼의입력양식에는 Text Box, Input Box, Check Box, Radio Button 등여러가지입력타입들이포함됩니다.

More information

HTML

HTML Hyper Text Markup Language Bok, Jong Soon jongsoon.bok@gmail.com www.javaexpert.co.kr 1 HTML 문서의특징 HyperText Markup Language WWW 문서제작에쓰임 SpaceBar, Tab, Enter 인식못함 텍스트문서의형태 컴퓨터기종에독립적 확장명 :.html,.htm 태그는대소문자구별안함

More information

<3033B0AD D4C5F584D4C5FC0CEC5CDB3DDBAB8C3E6C7D0BDC0C0DAB7E12E687770>

<3033B0AD D4C5F584D4C5FC0CEC5CDB3DDBAB8C3E6C7D0BDC0C0DAB7E12E687770> HTML/XML 인터넷보충학습자료 - 1 - - HTML 표를만들기위해서는 태그를사용한다. - - 테이블에서행과열을나눠주기위한태그는따로지정해야해며나눌개수만큼반복해서작성해야한다.

More information

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 05 장 CSS3 선택자 1. 선택자개요 2. 기본선택자 3. 속성선택자 4. 후손선택자와자손선택자 5. 반응 / 상태 / 구조선택자 CSS 블록을생성할수있다. 선택자를이해하고적절한선택자를활용할수있다. 1 선택자개요 CSS3 선택자 특정한 HTML 태그를선택할때사용하는기능 선택한태그에원하는스타일이나스크립트적용가능 그림 5-1 CSS 블록 CSS 블록 style

More information

INDEX 들어가기 고민하기 HTML(TABLE/FORM) CSS JS

INDEX 들어가기 고민하기 HTML(TABLE/FORM) CSS JS 개발자에게넘겨주기편한 TABLE&FORM 마크업 김남용 INDEX 들어가기 고민하기 HTML(TABLE/FORM) CSS JS 들어가기 이제는 ~ 서로간의이슈웹표준 & 웹접근성왜웹표준으로해야할까요? 모든웹페이지는 ~ 퍼블리싱순서 이제는 ~ 디자이너 디자이너 퍼블리셔 Front-end (UI 개발자 ) 퍼블리셔 Front-end (UI 개발자 ) 서버개발자 서버개발자

More information

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 03 장 HTML5 기본태그 1. 글자태그 2. 목록태그 3. 테이블태그 4. 이미지태그 5. 공간분할태그 HTML5 에서지원하는기본태그를사용할수있다. 공간분할태그와시맨틱태그의용도를이해하고사용할수있다. 1. 글자태그 가장많은비중을차지하는태그 그림 3-1 글자태그중심의웹페이지 1.1 제목글자태그 제목글자태그 문서의제목을표현할때사용 h : Heading을의미 표

More information

쉽게 풀어쓴 C 프로그래밍

쉽게 풀어쓴 C 프로그래밍 CHAPTER 7. HTML 와 CSS 로웹사이트만들 기 웹사이트작성 웹사이트구축과정 내비게이션구조도 홈페이지레이아웃 헤더 web Shop 내비게이션메뉴

More information

Microsoft PowerPoint HTML기초(2).pptx

Microsoft PowerPoint HTML기초(2).pptx 웹과인터넷활용및실습 () (Part II) 문양세강원대학교 IT 대학컴퓨터과학전공 강의내용 HTML의개요 HTML 문서의기본구조 HTML의구성요소 HTML 편집기기본적인 HTML 태그컬러와그래픽이미지하이퍼텍스트링크테이블프레임사운드 ( 오디오 ) 및동영상 Page 2 1 컬러코드와 RGB (1/4) 컬러 ( 색깔 ) 를지정하는두가지방법 컬러의이름을직접지정 (

More information

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 How to produce table XHTML 임정희 M2community 1 Table of Contents 1. XHTML - XHTML 과 HTML 2. Table XHTML - Table의이해 - Table 링크연결 - Table 작성 2 15 th KCSE Editor s Workshop, Seoul 2015 XHTML XHTML 기존에사용되던 HTML

More information

Microsoft PowerPoint - aj-lecture1-HTML-CSS-JS.ppt [호환 모드]

Microsoft PowerPoint - aj-lecture1-HTML-CSS-JS.ppt [호환 모드] Web Technology Stack HTML, CSS, JS Basics HTML Tutorial https://www.w3schools.com/html/default.asp CSS Tutorial https://www.w3schools.com/css/default.asp JS Tutorial 524730-1 2019 년봄학기 3/11/2019 박경신 https://www.w3schools.com/html/default.asp

More information

네트워크 명령 실습

네트워크 명령 실습 HTML 실습 Contents 1. HTML 개요 2. HTML 기본구조 3. HTML 기본태그 1. 글자관련 2. 서식관련 3. 표관련 4. 하이퍼링크관련 5. 프레임관련 6. 멀티미디어관련 7. 배경등꾸미기관련 8. 아이템화관련 3.4 하이퍼링크태그 1. 하이퍼링크란윈도우의도움말같은형태로문서안에특정문자열이나이미지를마우스로클릭했을때관련된다른문서, 그림, 음악,

More information

다른 JSP 페이지호출 forward() 메서드 - 하나의 JSP 페이지실행이끝나고다른 JSP 페이지를호출할때사용한다. 예 ) <% RequestDispatcher dispatcher = request.getrequestdispatcher(" 실행할페이지.jsp");

다른 JSP 페이지호출 forward() 메서드 - 하나의 JSP 페이지실행이끝나고다른 JSP 페이지를호출할때사용한다. 예 ) <% RequestDispatcher dispatcher = request.getrequestdispatcher( 실행할페이지.jsp); 다른 JSP 페이지호출 forward() 메서드 - 하나의 JSP 페이지실행이끝나고다른 JSP 페이지를호출할때사용한다. 예 ) RequestDispatcher dispatcher = request.getrequestdispatcher(" 실행할페이지.jsp"); dispatcher.forward(request, response); - 위의예에서와같이 RequestDispatcher

More information

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 HTML5 웹프로그래밍입문 5 장. 고급표현을위한 CSS3 활용 1 목차 5.1 박스모델설정하기 5.2 레이아웃설정하기 5.3 다양한효과설정하기 5.4 움직임설정하기 2 5.1 박스모델설정하기 5.1.1 영역설정을위한박스모델 5.1.2 박스모델유형의지정 3 영역설정을위한박스모델 배경영역 , , : 해당하는줄만큼배경 ,

More information

Microsoft PowerPoint - web-part01-ch10-문서객체모델.pptx

Microsoft PowerPoint - web-part01-ch10-문서객체모델.pptx 과목명 : 웹프로그래밍응용교재 : 모던웹을위한 JavaScript Jquery 입문, 한빛미디어 Part1. JavaScript / Ch10. 문서객체모델 2014년 1학기 Professor Seung-Hoon Choi 10 문서객체모델 문서객체모델 (Document Object Model, DOM) 웹브라우저가 HTML 페이지를인식하는방식 document

More information

제이쿼리 (JQuery) 정의 자바스크립트함수를쉽게사용하기위해만든자바스크립트라이브러리. 웹페이지를즉석에서변경하는기능에특화된자바스크립트라이브러리. 사용법 $( 제이쿼리객체 ) 혹은 $( 엘리먼트 ) 참고 ) $() 이기호를제이쿼리래퍼라고한다. 즉, 제이쿼리를호출하는기호

제이쿼리 (JQuery) 정의 자바스크립트함수를쉽게사용하기위해만든자바스크립트라이브러리. 웹페이지를즉석에서변경하는기능에특화된자바스크립트라이브러리. 사용법 $( 제이쿼리객체 ) 혹은 $( 엘리먼트 ) 참고 ) $() 이기호를제이쿼리래퍼라고한다. 즉, 제이쿼리를호출하는기호 제이쿼리 () 정의 자바스크립트함수를쉽게사용하기위해만든자바스크립트라이브러리. 웹페이지를즉석에서변경하는기능에특화된자바스크립트라이브러리. 사용법 $( 제이쿼리객체 ) 혹은 $( 엘리먼트 ) 참고 ) $() 이기호를제이쿼리래퍼라고한다. 즉, 제이쿼리를호출하는기호 CSS와마찬가지로, 문서에존재하는여러엘리먼트를접근할수있다. 엘리먼트접근방법 $( 엘리먼트 ) : 일반적인접근방법

More information

e-비즈니스 전략 수립

e-비즈니스 전략 수립 CSS3 속성 HTML5 웹프로그래밍입문 ( 개정판 ) Contents 학습목표 CSS3가지원하는스타일속성과스타일값을활용할수있습니다. CSS3를사용해레이아웃을잡을수있습니다. 내용 CSS3 단위 박스속성 display 속성 배경속성 글자속성 위치속성 float 속성 그림자속성 그레이디언트 2/85 1. CSS3 단위 키워드단위 W3C에서미리정의한단어 키워드를입력하면키워드에해당하는스타일이자동으로적용

More information

PowerPoint Presentation

PowerPoint Presentation 웹과인터넷활용및실습 (Web & Internet) Suan Lee - 웹과인터넷활용및실습 (Web & Internet) - 04. CSS3 스타일속성기본 1 04. CSS3 스타일속성 04. CSS3 Style Properties - 웹과인터넷활용및실습 (Web & Internet) - 04. CSS3 스타일속성기본 2 CSS3 단위 1 CSS 는각각의스타일속성에다양한값을입력

More information

var answer = confirm(" 확인이나취소를누르세요."); // 확인창은사용자의의사를묻는데사용합니다. if(answer == true){ document.write(" 확인을눌렀습니다."); else { document.write(" 취소를눌렀습니다.");

var answer = confirm( 확인이나취소를누르세요.); // 확인창은사용자의의사를묻는데사용합니다. if(answer == true){ document.write( 확인을눌렀습니다.); else { document.write( 취소를눌렀습니다.); 자바스크립트 (JavaScript) - HTML 은사용자에게인터페이스 (interface) 를제공하는언어 - 자바스크립트는서버로데이터를전송하지않고서할수있는데이터처리를수행한다. - 자바스크립트는 HTML 나 JSP 에서작성할수있고 ( 내부스크립트 ), 별도의파일로도작성이가능하다 ( 외 부스크립트 ). - 내부스크립트 - 외부스크립트

More information

02 장. 글꼴문단지정하기 이번장에서는스타일시트속성중에서글꼴과관련한속성과문단에관련된속성을살펴보도록하자.

02 장. 글꼴문단지정하기 이번장에서는스타일시트속성중에서글꼴과관련한속성과문단에관련된속성을살펴보도록하자. 02 장. 글꼴문단지정하기 이번장에서는스타일시트속성중에서글꼴과관련한속성과문단에관련된속성을살펴보도록하자. 이장에서다룰내용 1 2 3 4 5 글꼴꾸밈관련스타일시트텍스트관련스타일시트배경관련스타일시트목록관련스타일시트하이퍼링크관련스타일시트 2 01. 글꼴꾸밈관련스타일시트 v 글자에관련된스타일시트는크기, 스타일, 모양등에관련된 font 속성이가장많이사용 속성값설명 color

More information

Javascript

Javascript 1. 이벤트와이벤트핸들러의이해 이벤트 (Event) 는웹브라우저에서발생하는다양한사건을말합니다. 예를들면, 버튼을마우스로을했다거나브라우저를닫았다거나 Enter 키를눌렀다거나등등아주다양한사건들이있습니다. 그렇다면이벤트핸들러 (Event Handler) 는무엇일까요? 이다양한이벤트들을핸들링 ( 처리 ) 해주는것입니다. 예를들면, 어떤버튼을했을때메시지창이뜨게하는등을말합니다.

More information

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 : 학습내용 기본구조와태그다양한태그다루기 태그다루기프레임나누기폼양식및재미있게활용할수있는태그 : 03 장. 기본구조와태그 학습내용 기본구조에디트플러스에서 문서제작해보기 에서태그사용법 기본구조와태그 기본구조 [ 기본구조 ]

More information

Microsoft PowerPoint 세션.ppt

Microsoft PowerPoint 세션.ppt 웹프로그래밍 () 2006 년봄학기 문양세강원대학교컴퓨터과학과 세션변수 (Session Variable) (1/2) 쇼핑몰장바구니 장바구니에서는사용자가페이지를이동하더라도장바구니의구매물품리스트의내용을유지하고있어야함 PHP 에서사용하는일반적인변수는스크립트의수행이끝나면모두없어지기때문에페이지이동시변수의값을유지할수없음 이러한문제점을해결하기위해서 PHP 에서는세션 (session)

More information

Microsoft PowerPoint 웹 연동 기술.pptx

Microsoft PowerPoint 웹 연동 기술.pptx 웹프로그래밍및실습 ( g & Practice) 문양세강원대학교 IT 대학컴퓨터과학전공 URL 분석 (1/2) URL (Uniform Resource Locator) 프로토콜, 호스트, 포트, 경로, 비밀번호, User 등의정보를포함 예. http://kim:3759@www.hostname.com:80/doc/index.html URL 을속성별로분리하고자할경우

More information

Data Provisioning Services for mobile clients

Data Provisioning Services for mobile clients 9 장. 요청흐름제어와모듈화 1. 액션태그를이용한흐름제어 액션태그 하나의 JSP 페이지에서다른 JSP 페이지로요청처리를전달할때사용 중요사항 from.jsp 가아닌 to.jsp 가생성한응답결과가웹브라우저에전달된다. from.jsp 에서사용한 request, response 기본객체가 to.jsp 에그대로전달된다.

More information

Microsoft PowerPoint - HTML-CSS3.pptx

Microsoft PowerPoint - HTML-CSS3.pptx HTML & CSS3 고덕한 1 과정개요 HTML 에대한기초지식습득 HTML 구성요소파악 CSS 이해및활용 JavaScript 개요및사용법파악 DHTML을적용한페이지구성 2 HTML Structure 1. HTML 이해 2. CSS (Cascading Style Sheet) 3. JavaScript 4. 브라우저내장객체 5. 폼 (FORM) 관련객체 6. 레이어

More information

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 실습문제 Chapter 05 데이터베이스시스템... 오라클로배우는데이터베이스개론과실습 1. 실습문제 1 (5 장심화문제 : 각 3 점 ) 6. [ 마당서점데이터베이스 ] 다음프로그램을 PL/SQL 저장프로시져로작성하고실행해 보시오. (1) ~ (2) 7. [ 마당서점데이터베이스 ] 다음프로그램을 PL/SQL 저장프로시져로작성하고실행해 보시오. (1) ~ (5)

More information

쉽게 풀어쓴 C 프로그래밍

쉽게 풀어쓴 C 프로그래밍 CHAPTER 11. 자바스크립트와캔버스로게임 만들기 캔버스 캔버스는 요소로생성 캔버스는 HTML 페이지상에서사각형태의영역 실제그림은자바스크립트를통하여코드로그려야한다. 컨텍스트객체 컨텍스트 (context) 객체 : 자바스크립트에서물감과붓의역할을한다. var canvas = document.getelementbyid("mycanvas"); var

More information

[ 네이버마일리지 ] 디자인셋팅매뉴얼 1. 장바구니페이지에네이버마일리지안내추가 - 위치 : HTML 디자인설정 > 장바구니 > 장바구니주문목록 {{$c_3}} [ 편집 ] 버튼클릭 > HTML 편집탭으로이동 > 여러개의장바구니모두결제버튼 {u9} [ 편집 ] 버튼클릭하

[ 네이버마일리지 ] 디자인셋팅매뉴얼 1. 장바구니페이지에네이버마일리지안내추가 - 위치 : HTML 디자인설정 > 장바구니 > 장바구니주문목록 {{$c_3}} [ 편집 ] 버튼클릭 > HTML 편집탭으로이동 > 여러개의장바구니모두결제버튼 {u9} [ 편집 ] 버튼클릭하 [ 네이버마일리지 ] 디자인셋팅매뉴얼 1. 장바구니페이지에네이버마일리지안내추가 - 위치 : HTML 디자인설정 > 장바구니 > 장바구니주문목록 {{$c_3}} [ 편집 ] 버튼클릭 > HTML 편집탭으로이동 > 여러개의장바구니모두결제버튼 {u9} [ 편집 ] 버튼클릭하여팝업에서코드수정 1) 장바구니페이지디자인수정위치 디자인관리 > HTML 디자인설정 > 장바구니이동

More information

C스토어 사용자 매뉴얼

C스토어 사용자 매뉴얼 쪽지 APP 디자인적용가이드 I. 쪽지 APP 소개 2 I. 쪽지 APP 소개 쪽지 APP 을통해쇼핑몰의특정회원또는특정등급의회원그룹에게 알림메시지나마케팅을위한쪽지를발송하실수있습니다. 쪽지 APP의주요기능 1. 전체회원, 특정ID, 특정회원그룹별로쪽지발송가능 2. 발송예약기능 3. 발송한쪽지에대해수신및열람내역조회가능 4. 쇼핑몰페이지에서쪽지함과쪽지알림창제공 3

More information

Cookie Spoofing.hwp

Cookie Spoofing.hwp Cookie Spoofing&Sniffing By Maxoverpro[max]( 장상근) maxoverpro@empal.com http://www.maxoverpro.org 1. 서론 이문서는 Cookie Spoofing 과 Sniffing 에대해정석적인방법을이야기하도록하며또 한어느특정곳의취약점을설명하지않고직접제작한예제를가지고 Cookie Spoofing 과

More information

XSS Attack - Real-World XSS Attacks, Chaining XSS and Other Attacks, Payloads for XSS Attacks

XSS Attack - Real-World XSS Attacks, Chaining XSS and Other Attacks, Payloads for XSS Attacks XSS s XSS, s, May 25, 2010 XSS s 1 2 s 3 XSS s MySpace 사건. Samy (JS.Spacehero) 프로필 페이지에 자바스크립트 삽입. 스크립트 동작방식 방문자를 친구로 추가. 방문자의 프로필에 자바스크립트를 복사. 1시간 만에 백만 명이 친구등록. s XSS s 위험도가 낮은 xss 취약점을 다른 취약점과 연계하여

More information

<3035B0AD D4C5F584D4C5FC0CEC5CDB3DDBAB8C3E6C7D0BDC0C0DAB7E12E687770>

<3035B0AD D4C5F584D4C5FC0CEC5CDB3DDBAB8C3E6C7D0BDC0C0DAB7E12E687770> HTML/XML 인터넷보충학습자료 - 1 - - Cascading Style Sheets - HTML의단점을보완하기위해사용하는것으로, 웹문서에스타일 ( 예 ; 글꼴, 색상, 여백등 ) 을추가하는간단한메카니즘 1 다양한기능의확장 : HTML의단순한기능을확장 ( 추가, 변경 ) 시킴 2 통일된문서양식제공 : 한번의속성정의로여러문서에동시에적용가능 3 독립적인문서제작환경가능

More information

쉽게 풀어쓴 C 프로그래밍

쉽게 풀어쓴 C 프로그래밍 CHAPTER 13. HTML5 위치정보와드래그앤드롭 SVG SVG(Scalable Vector Graphics) 는 XML- 기반의벡터이미지포맷 웹에서벡터 - 기반의그래픽을정의하는데사용 1999 년부터 W3C 에의하여표준 SVG 의장점 SVG 그래픽은확대되거나크기가변경되어도품질이손상되지않는다. SVG 파일에서모든요소와속성은애니메이션이가능하다. SVG 이미지는어떤텍스트에디터로도생성하고편집할수있다.

More information

하둡을이용한파일분산시스템 보안관리체제구현

하둡을이용한파일분산시스템 보안관리체제구현 하둡을이용한파일분산시스템 보안관리체제구현 목 차 - 1 - - 2 - - 3 - - 4 - - 5 - - 6 - - 7 - - 8 - 1. 사용자가웹서버에로그인하여다양한서비스 ( 파일업 / 다운로드, 폴더생성 / 삭제 ) 를활용 2. 웹서버와연동된하둡서버에서업 / 다운로드된파일을분산저장. ( 자료송수신은 SSH 활용 ) - 9 - - 10 - - 11 -

More information

Front-Side 웹개발의이해 (CSS Basic) 1. CSS 란?

Front-Side 웹개발의이해 (CSS Basic) 1. CSS 란? CSS Basic 과정소개 과정목표 : CSS 의기본개념이해 1. CSS 란? 2. CSS 선택자 3. CSS 속성 1 Front-Side 웹개발의이해 (CSS Basic) 1. CSS 란? 1. CSS 란? - 스타일선언이위에서아래로순차적으로적용이되고, 마지막에선언된스타일이우선순위갖음 - 마크업언어 (HTML/XHTML) 가실제화면에표시되는방법을기술하는언어

More information

예스폼 프리미엄 템플릿

예스폼 프리미엄 템플릿 HTML 과 CSS 를활용한개별디자인 D4 강사김준일 01. HTML, CSS 그리고메이크샵 1 2 쇼핑몰의구조와기능 이미지, 문구등내용을 담당하는언어 쇼핑몰 쇼핑몰이어떻게보여질지 표현 ( 디자인 ) 을담당하는언어 3 4 쇼핑몰의 UI 및배너등을 표현하며유효성검사등을 담당하는개발언어 쇼핑몰의핵심기능을담당하는 쇼핑몰프로그램으로 HTML,CSS,Javascript

More information

EBS직탐컴퓨터일반-06-OK

EBS직탐컴퓨터일반-06-OK ES 컴퓨터 일반 6회 시간 분 배점 점 문항에 따라 배점이 다르니, 각 물음의 끝에 표시된 배점을 참고하시오. 점 문항에만 점수가 표시되어 있습니다. 점수 표시가 없는 문항은 모두 점씩입니다. 은,, 에서 입력받아 를 출력하는 스위치 회로이다. 스위치 회로를 논리 기호로 표시한 것으로 옳은 것은? 다음은 정보 통신망을 사용한 사례이다. 법적으로 처벌받을

More information

Lab1

Lab1 Lab 1: HTML CSS 2015 Fall human-computer interaction + design lab. Joonhwan Lee HTML Web Server (World Wide Web: WWW)? (., FTP ). web 3 웹 구조의 이해 웹페이지 웹페이지는 HTML 이라는 언어로 만들어진 일종의 프로그램 웹페이지는 텍스트, 이미지, 동영상,

More information

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 PHP 와 MySQL 의연동 Jo, Heeseung Content MySQL을지원하는 PHP API 함수 과변수값전달 DB 테이블생성과데이터읽기성적관리프로그램제작 2 1.2 DB 테이블생성과레코드삽입 데이터베이스테이블구조설계 [ 표 7-1] 명함관리데이터베이스테이블 ( 테이블명 : biz_card) 필드명 타입 추가사항 설명 num int primary

More information

(Microsoft PowerPoint - 9\300\345.ppt [\310\243\310\257 \270\360\265\345])

(Microsoft PowerPoint - 9\300\345.ppt [\310\243\310\257 \270\360\265\345]) 제9장폼객체 객체다루기 학습목표 폼객체에서사용하는속성, 메소드, 이벤트핸들러를이해한다. 목록상자에서사용하는속성, 메소드, 이벤트핸들러를이해한다. 목차 9.1 form 객체 9.2 입력상자, 체크상자, 라디오버튼 9.3 목록상자 2 9.1 form 객체 폼은주로서버에어떤데이터를보내고자하는경우에많이사용한다. 태그를제어하는 form 객체의기본용법은다음과같다

More information

iii. Design Tab 을 Click 하여 WindowBuilder 가자동으로생성한 GUI 프로그래밍환경을확인한다.

iii. Design Tab 을 Click 하여 WindowBuilder 가자동으로생성한 GUI 프로그래밍환경을확인한다. Eclipse 개발환경에서 WindowBuilder 를이용한 Java 프로그램개발 이예는 Java 프로그램의기초를이해하고있는사람을대상으로 Embedded Microcomputer 를이용한제어시스템을 PC 에서 Serial 통신으로제어 (Graphical User Interface (GUI) 환경에서 ) 하는프로그램개발예를설명한다. WindowBuilder:

More information

Windows 8에서 BioStar 1 설치하기

Windows 8에서 BioStar 1 설치하기 / 콘텐츠 테이블... PC에 BioStar 1 설치 방법... Microsoft SQL Server 2012 Express 설치하기... Running SQL 2012 Express Studio... DBSetup.exe 설정하기... BioStar 서버와 클라이언트 시작하기... 1 1 2 2 6 7 1/11 BioStar 1, Windows 8 BioStar

More information

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 HTML5 웹프로그래밍입문 2 장.HTML5 문서의기본 목차 2.1 기본문서만들기 2.2 단락과텍스트꾸미기 2.3 목록및표작성하기 2.4 문서구조화하기 소스코드실행사이트 주소 : http://webclass.me/html5_2e 폴더 ch02/ ~ ch13/ 에각장의예제가있어서실행결과확인및소스보기가가능합니다. 2 HTML5 문서의기본 2.1 기본문서만들기 2.1.1

More information

컴퓨터프로그래밍 - HTML

컴퓨터프로그래밍 - HTML 컴퓨터프로그래밍 - HTML HTML 이란? v Hyper Text Markup Language v 웹문서제작에사용되는표준언어 v 문서타입 : 텍스트파일형식 HTML 문서의특징 v 공백, 줄바꿈인식못함 v 텍스트문서의형태 - 확장명 :.html,.htm v 인터넷문서로사용하기에적합 - 컴퓨터기종에무관 - 파일크기작음 v 대소문자를구분하지않음 HTML 문서의작동원리

More information

수식모드수식의표현법 수학식표현 조남운 조남운 수학식표현

수식모드수식의표현법 수학식표현 조남운 조남운 수학식표현 조남운 mailto:namun.cho@gmail.com 2008.2.20 AMS-TEX 미국수학회 (American Mathematical Society) 에서만든수학패키지 대부분의수학표현은 AMS-TEX 을이용하고있음. 자세한내용은 AMS-TEX 매뉴얼을참조할것. http://www.ams.org/tex/amstex.html AMS-TEX 패키지선언 \usepackage{amssymb,

More information

歯

歯 http://phya.yonsei.ac.kr/~gang/ Version. 1.0.0 1995129 http://phya.yonsei.ac.kr/~gang/ Version. 1.0.0 1995129 Netscape (Web Browser), WWW, HTML....,. HWP 2.1 format, http://phya.yonsei.ac.kr/~gang/writings/home100.zip.,

More information

Week8-Extra

Week8-Extra Week 08 Extra HTML & CSS Joonhwan Lee human-computer interaction + design lab. HTML CSS HTML, HTML 5 1. HTML HTML HTML HTML (elements) (attributes), (arguments). HTML (tag), DTD (Document Type Definition).!4

More information

Microsoft Word - ntasFrameBuilderInstallGuide2.5.doc

Microsoft Word - ntasFrameBuilderInstallGuide2.5.doc NTAS and FRAME BUILDER Install Guide NTAS and FRAME BUILDER Version 2.5 Copyright 2003 Ari System, Inc. All Rights reserved. NTAS and FRAME BUILDER are trademarks or registered trademarks of Ari System,

More information

쉽게 풀어쓴 C 프로그래밍

쉽게 풀어쓴 C 프로그래밍 CHAPTER 5. CSS 박스모델과응용 박스모델 HTML 요소들을박스 ( 사각형 ) 형태로그리는것 박스는배치, 색상, 경계등의속성을가진다. 박스모델의속성 배경색과배경이미지 HTML 요소에배경색과배경이미지가설정되어있는경우에, 패딩은투명하므로배경이미지와배경색이보이게된다 ( 그림출처 : Jon Hicks) 경계선스타일

More information

제 1 절 복습 \usepackage{ g r a p h i c x }... \ i n c l u d e g r a p h i c s [ width =0.9\ textwidth ] { b e a r. j p g } (a) includegraphics 사용의일반적인유형

제 1 절 복습 \usepackage{ g r a p h i c x }... \ i n c l u d e g r a p h i c s [ width =0.9\ textwidth ] { b e a r. j p g } (a) includegraphics 사용의일반적인유형 그림배치 이주용 jlee@formal.korea.ac.kr 2011 년 9 월 28 일 제 1 절 복습 \usepackage{ g r a p h i c x }... \ i n c l u d e g r a p h i c s [ width =0.9\ textwidth ] { b e a r. j p g } (a) includegraphics 사용의일반적인유형 (b)

More information

0. 들어가기 전

0. 들어가기 전 컴퓨터네트워크 14 장. 웹 (WWW) (3) - HTTP 1 이번시간의학습목표 HTTP 의요청 / 응답메시지의구조와동작원리이해 2 요청과응답 (1) HTTP (HyperText Transfer Protocol) 웹브라우저는 URL 을이용원하는자원표현 HTTP 메소드 (method) 를이용하여데이터를요청 (GET) 하거나, 회신 (POST) 요청과응답 요청

More information

쉽게 풀어쓴 C 프로그래밍

쉽게 풀어쓴 C 프로그래밍 CHAPTER 6. CSS 레이아웃과애니메이션 레이아웃이란? 웹페이지에서 HTML 요소의위치, 크기등을결정하는것 집안에서의가구배치와비슷하다. 블록요소와인라인요소 블록 (block) 요소 - 화면의한줄을전부차지한다. 인라인 (inline) 요소 - 한줄에차례대로배치된다. 현재줄에서필요한만큼의너비만을차지한다. 블록요소 한줄을전부차지 , , ,

More information

PART 1 CHAPTER 1 Chapter 1 Note 4 Part 1 5 Chapter 1 AcctNum = Table ("Customer").Cells("AccountNumber") AcctNum = Customer.AccountNumber Note 6 RecordSet RecordSet Part 1 Note 7 Chapter 1 01:

More information

HTML5

HTML5 퀴즈 류관희 게임규칙 동적으로 HTML 요소생성 생성된 HTML 요소의화면배치및위치옮기기 퀴즈게임 국가명과수도명의짝맞추기 배열 ( 국가명, 수도명 ) 짝모두맞추면 => 동영상플레이 2 퀴즈게임 3 4 5 6 주요특징 배열 : 국가명과수도명저장 피드백 : 색상변경, 동영상재생 플레이 20쌍중에 4 쌍무작위로선택 글자 : 국가명과수도명 => 그림으로대치 7 사전준비항목

More information

UNIST_교원 홈페이지 관리자_Manual_V1.0

UNIST_교원 홈페이지 관리자_Manual_V1.0 Manual created by metapresso V 1.0 3Fl, Dongin Bldg, 246-3 Nonhyun-dong, Kangnam-gu, Seoul, Korea, 135-889 Tel: (02)518-7770 / Fax: (02)547-7739 / Mail: contact@metabrain.com / http://www.metabrain.com

More information

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 기본과활용 목차 1. HTML와 CSS 시작 2. HTML 기본문서작성 3. 텍스트, 목록, 하이퍼링크 4. 박스, 표 5. 이미지와멀티미디어 6. 입력폼양식 웹개발환경 웹브라우저종류 익스플로러, 크롬, 파이어폭스, 사파리, 오페라 웹개발편집기 메모장 (Notepad) 노트패드 ++(Notepad++) 아크로에디트 (AcroEdit) 드림위버 (Dreamweaver)

More information

게임 기획서 표준양식 연구보고서

게임 기획서 표준양식 연구보고서 ᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞ ᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞ ᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞ ᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞ ᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞ ᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞ ᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞᆞ

More information

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 ONE page html 이란? 원페이지는최근의홈페이지제작트렌드로한페이지에상단에서하단으로의마우스스크롤링을통해서컨텐츠를보여주는스타일의홈페이지입니다. USER 의시선을분산시키지않고위쪽에서아래쪽으로마우스스크롤링을통해서홈페이지의컨텐츠를보여주게됩니다. 반응형으로제작되어스마트폰, 아이패드, 태블릿,PC, 노트북등다양한디바이스에서자동으로최적화됩니다. ONE page 웹사이트사례

More information

JSP 의내장객체 response 객체 - response 객체는 JSP 페이지의실행결과를웹프라우저로돌려줄때사용되는객체이다. - 이객체는주로켄텐츠타입이나문자셋등의데이터의부가정보 ( 헤더정보 ) 나쿠키 ( 다음에설명 ) 등을지정할수있다. - 이객체를사용해서출력의방향을다른

JSP 의내장객체 response 객체 - response 객체는 JSP 페이지의실행결과를웹프라우저로돌려줄때사용되는객체이다. - 이객체는주로켄텐츠타입이나문자셋등의데이터의부가정보 ( 헤더정보 ) 나쿠키 ( 다음에설명 ) 등을지정할수있다. - 이객체를사용해서출력의방향을다른 JSP 의내장객체 response 객체 - response 객체는 JSP 페이지의실행결과를웹프라우저로돌려줄때사용되는객체이다. - 이객체는주로켄텐츠타입이나문자셋등의데이터의부가정보 ( 헤더정보 ) 나쿠키 ( 다음에설명 ) 등을지정할수있다. - 이객체를사용해서출력의방향을다른 URL로바꿀수있다. 예 ) response.sendredirect("http://www.paran.com");

More information

Dialog Box 실행파일을 Web에 포함시키는 방법

Dialog Box 실행파일을 Web에 포함시키는 방법 DialogBox Web 1 Dialog Box Web 1 MFC ActiveX ControlWizard workspace 2 insert, ID 3 class 4 CDialogCtrl Class 5 classwizard OnCreate Create 6 ActiveX OCX 7 html 1 MFC ActiveX ControlWizard workspace New

More information

Visual Basic 반복문

Visual Basic 반복문 학습목표 반복문 For Next문, For Each Next문 Do Loop문, While End While문 구구단작성기로익히는반복문 2 5.1 반복문 5.2 구구단작성기로익히는반복문 3 반복문 주어진조건이만족하는동안또는주어진조건이만족할때까지일정구간의실행문을반복하기위해사용 For Next For Each Next Do Loop While Wend 4 For

More information

NATE CP 가이드 1. WML 페이지에서줄바꿈문제 개요 WML 페이지에서줄바꿈은명시적으로 <br/> 태그를사용하여야한다. 설명그림 2 의의도로제작된페이지에서 Card Styles 텍스트와 Select 박스사이에명시적인 <br/> 태그가없어, 그림 1 과같이줄바꿈이되

NATE CP 가이드 1. WML 페이지에서줄바꿈문제 개요 WML 페이지에서줄바꿈은명시적으로 <br/> 태그를사용하여야한다. 설명그림 2 의의도로제작된페이지에서 Card Styles 텍스트와 Select 박스사이에명시적인 <br/> 태그가없어, 그림 1 과같이줄바꿈이되 NATE CP 가이드 1. WML 페이지에서줄바꿈문제 WML 페이지에서줄바꿈은명시적으로 태그를사용하여야한다. 그림 2 의의도로제작된페이지에서 Card Styles 텍스트와 Select 박스사이에명시적인 태그가없어, 그림 1 과같이줄바꿈이되지않고한줄로보여짐. [ 그림 1] 비정상 [ 그림 2] 정상

More information

Microsoft PowerPoint - GUI _DB연동.ppt [호환 모드]

Microsoft PowerPoint - GUI _DB연동.ppt [호환 모드] GUI 설계 6 주차 DB 연동김문정 tops@yd.ac.kr 강의순서강의전환경 JDK 설치및환경설정톰캣설치및환경설정이클립스 (JEE) 설치및환경설정 MySQL( 드라이버 ) 설치및커넥터드라이브연결 DB 생성 - 계정생성이클립스에서 DB에연결서버생성 - 프로젝트생성 DB연결테이블생성및등록 2 MySQL 설치확인 mysql - u root -p MySQL 에데이터베이스추가

More information

쉽게 풀어쓴 C 프로그래밍

쉽게 풀어쓴 C 프로그래밍 CHAPTER 10. DOM 과이벤트처리, 입력검 증 문서객체모델 (DOM) DOM 은 HTML 문서의계층적인구조를트리 (tree) 로표현 DOM 과 BOM HTML 문서를객체로표현한것을 DOM 웹브라우저를객체로표현한것을 BOM(Browser Object Model) HTML 요소찾기 동적인웹페이지를작성하려면원하는요소를찾아야한다. id 로찾기 태그이름으로찾기

More information

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 HTML5 웹프로그래밍입문 6 장. 다양한입력폼 1 목차 6.1 폼이해하기 6.2 기본형식으로입력하기 6.3 고급형식으로입력하기 2 6.1 폼이해하기 3 요소의사용 폼요소의사용 회원가입, 상품구매, 키워드검색등사용자로부터정보를받을때 사용자와애플리케이션이상호작용 사용자입력 전송버튼 애플리케이션에전달 실행결과반환 요소의역할 사용자가입력하는정보를하나로묶어서애플리케이션에전달

More information

쉽게 풀어쓴 C 프로그래밍

쉽게 풀어쓴 C 프로그래밍 CHAPTER 3. HTML 멀티미디어와입력요소 웹브라우저와멀티미디어 예전방법 : HTML 안에서는 나 태그를사용하여야했고웹브라우저에는플래시나 ActiveX 를설치 HTML5: 와 태그가추가 오디오 요소의속성 오디오파일형식 MP3 'MPEG-1 Audio Layer-3' 의약자로 MPEG

More information

SmartEditor Basic 2.0 개발자 가이드

SmartEditor Basic 2.0 개발자 가이드 목차 소개 9 SmartEditor Basic 2.0 의특징 9 지원브라우저 10 제공기능상세 10 글꼴 10 글자크기 11 글자효과 12 글자색 13 글자배경색 14 위첨자와아래첨자 15 정렬 16 줄간격 16 번호매기기 17 글머리기호 17 내어쓰기와들여쓰기 17 인용구스타일 18 하이퍼링크 18 특수기호 19 표생성과간단편집기 20 찾기와바꾸기 21 편집모드

More information

Ext JS À¥¾ÖÇø®ÄÉÀ̼ǰ³¹ß-³¹Àå.PDF

Ext JS À¥¾ÖÇø®ÄÉÀ̼ǰ³¹ß-³¹Àå.PDF CHAPTER 2 (interaction) Ext JS., HTML, onready, MessageBox get.. Ext JS HTML CSS Ext JS.1. Ext JS. Ext.Msg: : Ext Ext.get: DOM 22 CHAPTER 2 (config). Ext JS.... var test = new TestFunction( 'three', 'fixed',

More information

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 Html 은웹에서 text, images, movie 등다양한정보의요소를 담을수있는문서형식이다. 정보 (txt, imges) 전송 = 동일한어플리케이션 = 정보 (txt, imges) 정보 (txt, imges Movie, 동작 ) 정보 (txt, imges movie) 어플리케이션 웹브라우저 HTML5 는기존 HTML 에차별화된특징을가진 최신버전의웹표준언어.

More information

Overall Process

Overall Process CSS ( ) Overall Process Overall Process (Contents : Story Board or Design Source) (Structure : extensible HyperText Markup Language) (Style : Cascade Style Sheet) (Script : Document Object Model) (Contents

More information

리포트_23.PDF

리포트_23.PDF Working Paper No 23 e-business Integrator From Strategy to Technology To remove the gap between e-biz strategy and implementation (eeyus@e-bizgroupcom) Creative Design 2001 04 24 e-business Integrator

More information

5장. JSP와 Servlet 프로그래밍을 위한 기본 문법(완성-0421).hwp

5장. JSP와 Servlet 프로그래밍을 위한 기본 문법(완성-0421).hwp 1 0 1.7 6 5 'A ' '/ u 4 4 2 2 ' " JS P 프로그래밍 " A ', 'b ', ' 한 ', 9, \ u d 6 5 4 ' c h a r a = 'A '; 0 1 0 2 0 3 0 4 0 5 0 6 0 7 0 8 0 9 1 0 1 1 1 2 1 3 1 4 1 5 1 6 1 7 1 8 1 9 < % @ p a g e c o n te n

More information

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 Web server porting 2 Jo, Heeseung Web 을이용한 LED 제어 Web 을이용한 LED 제어프로그램 web 에서데이터를전송받아타겟보드의 LED 를조작하는프로그램을작성하기위해다음과같은소스파일을생성 2 Web 을이용한 LED 제어 LED 제어프로그램작성 8bitled.html 파일을작성 root@ubuntu:/working/web# vi

More information

Microsoft Word - src.doc

Microsoft Word - src.doc IPTV 서비스탐색및콘텐츠가이드 RI 시스템운용매뉴얼 목차 1. 서버설정방법... 5 1.1. 서비스탐색서버설정... 5 1.2. 컨텐츠가이드서버설정... 6 2. 서버운용방법... 7 2.1. 서비스탐색서버운용... 7 2.1.1. 서비스가이드서버실행... 7 2.1.2. 서비스가이드정보확인... 8 2.1.3. 서비스가이드정보추가... 9 2.1.4. 서비스가이드정보삭제...

More information

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 실습 1 배효철 th1g@nate.com 1 목차 조건문 반복문 System.out 구구단 모양만들기 Up & Down 2 조건문 조건문의종류 If, switch If 문 조건식결과따라중괄호 { 블록을실행할지여부결정할때사용 조건식 true 또는 false값을산출할수있는연산식 boolean 변수 조건식이 true이면블록실행하고 false 이면블록실행하지않음 3

More information

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 System Software Experiment 1 Lecture 5 - Array Spring 2019 Hwansoo Han (hhan@skku.edu) Advanced Research on Compilers and Systems, ARCS LAB Sungkyunkwan University http://arcs.skku.edu/ 1 배열 (Array) 동일한타입의데이터가여러개저장되어있는저장장소

More information

View Licenses and Services (customer)

View Licenses and Services (customer) 빠른 빠른 시작: 시작: 라이선스, 라이선스, 서비스 서비스 및 주문 주문 이력 이력 보기 보기 고객 가이드 Microsoft 비즈니스 센터의 라이선스, 서비스 및 혜택 섹션을 통해 라이선스, 온라인 서비스, 구매 기록 (주문 기록)을 볼 수 있습니다. 시작하려면, 비즈니스 센터에 로그인하여 상단 메뉴에서 재고를 선택한 후 내 재고 관리를 선택하십시오. 목차

More information

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 HTML5 웹프로그래밍입문 부록. 웹서버구축하기 1 목차 A.1 웹서버시스템 A.2 PHP 사용하기 A.3 데이터베이스연결하기 2 A.1 웹서버시스템 3 웹서버의구축 웹서버컴퓨터구축 웹서버소프트웨어설치및실행 아파치 (Apache) 웹서버가대표적 서버실행프로그램 HTML5 폼을전달받아처리 PHP, JSP, Python 등 데이터베이스시스템 서버측에데이터를저장및효율적관리

More information

학습목표 함수프로시저, 서브프로시저의의미를안다. 매개변수전달방식을학습한다. 함수를이용한프로그래밍한다. 2

학습목표 함수프로시저, 서브프로시저의의미를안다. 매개변수전달방식을학습한다. 함수를이용한프로그래밍한다. 2 학습목표 함수프로시저, 서브프로시저의의미를안다. 매개변수전달방식을학습한다. 함수를이용한프로그래밍한다. 2 6.1 함수프로시저 6.2 서브프로시저 6.3 매개변수의전달방식 6.4 함수를이용한프로그래밍 3 프로시저 (Procedure) 프로시저 (Procedure) 란무엇인가? 논리적으로묶여있는하나의처리단위 내장프로시저 이벤트프로시저, 속성프로시저, 메서드, 비주얼베이직내장함수등

More information

Microsoft PowerPoint - web-part02-ch15-문서객체조작.pptx

Microsoft PowerPoint - web-part02-ch15-문서객체조작.pptx 과목명 : 웹프로그래밍응용교재 : 모던웹을위한 JavaScript Jquery 입문, 한빛미디어 Part2. jquery Ch15. 문서객체조작 2014년 1학기 Professor Seung-Hoon Choi 15 문서객체조작 문서객체조작 자바스크립트만으로문서객체모델을다루려면복잡함 jquery를이용하면쉽게다룰수있다. 이책에서가장중요한부분 15.1 문서객체의클래스속성추가

More information

1

1 7차시. 이즐리와 택시도를 활용한 인포그래픽 제작 1. 이즐리 사이트에 대해 알아보고 사용자 메뉴 익히기 01. 이즐리(www.easel.ly) 사이트 접속하기 인포그래픽 제작을 위한 이즐리 사이트는 무료로 제공되는 템플릿을 이용하여 간편하게 인포그래 픽을 만들 수 있는 사이트입니 이즐리는 유료, 무료 구분이 없는 장점이 있으며 다른 인포그래픽 제작 사이트보다

More information

Microsoft PowerPoint - web-part03-ch20-XMLHttpRequest기본.pptx

Microsoft PowerPoint - web-part03-ch20-XMLHttpRequest기본.pptx 과목명 : 웹프로그래밍응용교재 : 모던웹을위한 JavaScript Jquery 입문, 한빛미디어 Part3. Ajax Ch20. XMLHttpRequest 2014년 1학기 Professor Seung-Hoon Choi 20 XMLHttpRequest XMLHttpRequest 객체 자바스크립트로 Ajax를이용할때사용하는객체 간단하게 xhr 이라고도부름 서버

More information

1809_2018-BESPINGLOBAL_Design Guidelines_out

1809_2018-BESPINGLOBAL_Design Guidelines_out 베스핀글로벌 디자인 가이드라인 베스핀글로벌은 경험과 기술을 바탕으로 고객에게 신뢰를 주는 기업이기를 지향합니다. 모든 서비스와 소통채널에서 우리의 가치를 일관되게 표현하도록 합니다. SIGNATURE SIGNATURE + SLGAN SIGNATURE [CHINA] SIGNATURE + SYMBL 2018년 1.ver 베스핀글로벌 디자인 가이드라인 디자인 가이드라인을

More information

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 09 장 문서객체모델 1. 문서객체모델관련용어 2. 웹페이지생성순서 3. 문서객체선택 4. 문서객체조작 5. 이벤트 문서객체와문서객체모델의개념을이해한다. 문서객체를선택하고조작할수있다. 이벤트의종류를알아보고문서객체에이벤트를연결해본다. 1 문서객체모델관련용어 문서객체모델 (DOM) Document Object Model 웹브라우저가 HTML 파일을분석하고표시하는방법

More information

Visual Basic 기본컨트롤

Visual Basic 기본컨트롤 학습목표 폼 ( Form) 폼의속성, 컨트롤이름, 컨트롤메서드 기본컨트롤 레이블, 텍스트박스, 버튼, 리스트박스 이벤트 버튼 기본컨트롤실습 2 2.1 폼 (Form) 2.2 기본컨트롤 2.3 기본컨트롤실습 3 폼 - 속성 속성 (Name) AutoSize BackColor Font ForeColor Icon StartPosition Transparency WindowState

More information

쉽게 풀어쓴 C 프로그래밍

쉽게 풀어쓴 C 프로그래밍 CHAPTER 4. CSS 스타일시트기초 CSS 의개념 문서의구조 -> HTML 문서의스타일 ->? CSS 의역할 만약 CSS 가없다면 CSS CSS(Cascading Style Sheets): 문서의스타일을지정한다. CSS 의장점 거대하고복잡한사이트를관리할때에필요 모든페이지들이동일한 CSS 를공유 CSS 에서어떤요소의스타일을변경하면관련되는전체페이지의내용이한꺼번에변경

More information

Data Provisioning Services for mobile clients

Data Provisioning Services for mobile clients 7 장. Form 처리와파일업로드 제 7 장 HTML 태그 1. 폼 (Form) 태그소개 사용자에게정보를요청하고적당한대답을얻어낼수있는텍스트박스나체크박스등을제공한다. 사용자로부터의정보를서버에게전달할수있는 submit( 전달 ) 버튼을제공한다. submit 버튼은새페이지 (JSP 에의해생성되는동적페이지 ) 를열기위해사용된다. 2/33 제 1 장

More information