Microsoft PowerPoint - SCLURYPCHTYJ

Size: px
Start display at page:

Download "Microsoft PowerPoint - SCLURYPCHTYJ"

Transcription

1 12. 구현기술 Ⅵ - CSS t y i li Acce ssi b W e b

2 문자색및배경 글꼴및텍스트 표및사용자인터페이스 음성스타일시트

3 학습내용 문자색과배경, 글꼴과텍스트에대해이해한다. 사용자인터페이스및음성스타일시트에대해이해한다. 3 / 58

4 문자색및배경 문자색속성 (color 속성 ) 배경속성 (background 속성 ) 배경색, 배경이미지, 내용의관계 배경이미지반복 (background-repeat repeat 속성 ) 배경이미지이동 / 고정 (background-attachment attachment 속성 ) 배경이미지초기위치 (background-position 속성 ) 배경관련속성일괄지정

5 문자색속성 (color 속성 ) 12.1 문자색및배경 텍스트에색상을지정하기위한속성 색상값 (RGB값, 또는색상단어 ), inherit 브라우저에의존모든요소상속지정불가 visual 없음없음 5 / 58

6 배경속성 (background 속성 ) 12.1 문자색및배경 요소의배경에색상을지정 배경은박스모델에서내용, 패딩, 보더영역에모두적용 마진영역은항상투명 색상값 (RGB값, 또는색상단어 ), inherit, transparent transparent 모든요소상속하지않음지정불가 visual 없음 Netscape4 6 / 58

7 배경색속성 (background 속성 ) 12.1 문자색및배경 문자색과배경색의대비 전경색과배경색은충분한색대비를주는것이효율적 문자 문자 7 / 58

8 배경색속성 (background 속성 ) 12.1 문자색및배경 명도차와색차계산 명도차 전경색과배경색을각각 RGB 값을 0~255의 10진수로전환 {(R*299)+(G*299)+(B*299)}/1000 으로각각의명도계산 명도차는 125 이상이될수있도록지정 ( 권장 ) 색차 전경색과배경색을각각 RGB 값을 0~255의 10진수로전환 {max( 배경색R, 전경색R)-min( 배경색R, 전경색R)}+ {max( 배경색G, 전경색G)-min( 배경색G, 전경색G)}+ {max( 배경색B, 전경색B)-min( 배경색B, 전경색B)} 색차는 500 이상이될수있도록지정 ( 권장 ) 8 / 58

9 배경색속성 (background 속성 ) 12.1 문자색및배경 요소의배경이미지지정 URI값 (RGB값, 또는색상단어 ), inherit, none none 모든요소상속하지않음지정불가 visual 없음 Netscape4, Oepra 6, Mac IE4/5 9 / 58

10 12.1 문자색및배경 배경색, 배경이미지, 내용의관계 배경속성에있어서는배경색위에배경이미지가표시되며제일상단에 내용이표시 내용 배경이미지 배경색 10 / 58

11 문자색및배경 배경이미지반복 (background-repeat repeat 속성 ) 배경이미지의반복을지정 rapeat, repeat-x, repeat-y, no-repeat, inherit repeat 모든요소상속하지않음지정불가 Visual 없음없음 11 / 58

12 12.1 문자색및배경 배경이미지이동 / 고정 (background-attachment attachment 속성 ) 배경이미지의이동이나고정을지정 scroll, fixed, inherit scroll 모든요소상속하지않음지정불가 Visual Netscape4 없음 12 / 58

13 12.1 문자색및배경 배경이미지초기위치 (background-position 속성 ) 배경이미지의초기위치지정 scroll, fixed, inherit scroll 모든요소상속하지않음지정불가 Visual Netscape4 없음 13 / 58

14 12.1 문자색및배경 배경관련속성일괄지정 배경과관련된속성의일괄지정 background-color, background-image, background-repeat, background-attachment, background-position, inherit 간략화속성이므로기본값없음 모든요소 상속하지않음 background-position 에서만지정가능 Visual 없음 Netscape4 14 / 58

15 글꼴및텍스트 글꼴패밀리속성 (font-family family 속성 ) 글꼴스타일속성 (font-style 속성 ) 글꼴변형속성 (font-variant 속성 ) 글꼴크기, 폭, 굵기속성 들여쓰기속성 (text-indent 속성 ) 정렬속성 (text-align 속성 ) 장식, 그림자속성 문자간격, 단어간격속성 대소문자변환및공백처리

16 글꼴패밀리속성 (font-family family 속성 ) 12.2 글꼴및텍스트 글꼴패밀리지정을위한속성 글꼴패밀리명, 대표패밀리명, inherit 브라우저에의존모든요소상속한다지정불가 Visual 없음 Win IE 4, Netscape 4, Safari 16 / 58

17 글꼴스타일속성 (font-style 속성 ) 12.2 글꼴및텍스트 글꼴스타일지정을위한속성 normal, talic, oblique, inherit normal 모든요소상속한다지정불가 Visual 없음 Netscape 4 17 / 58

18 글꼴변형속성 (font-variant 속성 ) 12.2 글꼴및텍스트 글꼴변형을위한속성 normal, small-caps, inherit normal 모든요소상속한다지정불가 Visual Netscape 4 Win IE 4/5/5.5, Mac IE 4 18 / 58

19 글꼴크기, 폭, 굵기속성 12.2 글꼴및텍스트 글꼴크기 (font-size) 를지정하기위한속성 normal, small-caps, inherit normal 모든요소상속한다지정불가 Visual Netscape 4 Win IE 4/5/5.5, Mac IE 4 19 / 58

20 글꼴크기, 폭, 굵기속성 12.2 글꼴및텍스트 글꼴크기 (font-size) 를지정하기위한속성 절대사이즈, 상대사이즈, 길이, 퍼센테이지, inherit medium 모든요소상속한다부모요소의글꼴사이즈참조 Visual 없음 Win IE 4/5/5.5, netscape 4, Opera 6, Mac IE 4 20 / 58

21 글꼴크기, 폭, 굵기속성 12.2 글꼴및텍스트 글꼴폭 (font-stretch) 을지정하기위한속성 normal, wider, narrower, ultra-condensed, extra-condensed, condensed, semicondensed, semi-expanded, expanded, extraexpanded, ultra-expanded, inherit normal 모든요소 상속한다 지정불가 Visual 모든브라우저 없음 21 / 58

22 글꼴크기, 폭, 굵기속성 12.2 글꼴및텍스트 글꼴굵기 (font-weight) 를지정하기위한속성 normal, bold, bolder, lighter, 100, 200, 300, 400, 500, 600, 700, 800, 900, inherit Normal 모든요소 상속한다 지정불가 Visual 없음 Netscape 4 22 / 58

23 들여쓰기속성 (text-indent 속성 ) 12.2 글꼴및텍스트 텍스트최초에등장하는행의들여쓰기폭을지정하기위한속성 길이, 퍼센테이지, inherit 0 블록레벨요소상속포함블록의폭참조 Visual 없음없음 23 / 58

24 정렬속성 (text-align 속성 ) 12.2 글꼴및텍스트 텍스트정렬을지정하기위한속성 left, right, center, justify, 텍스트, inherit 브라우저와텍스트의표기방향에의존블록레벨요소상속지정불가 Visual 없음 Netscape 4, Mac IE 4 24 / 58

25 장식, 그림자속성 12.2 글꼴및텍스트 텍스트의장식 (text-decoration) 을지정하기위한속성 none, underline, overline, line-though, blinlk, inherit none 모든요소 상속하지않음 지정불가 Visual 없음 Netscape 4, Mac IE 4 25 / 58

26 12.2 글꼴및텍스트 장식, 그림자속성 텍스트에그림자 (text-shadow) 를넣기위한속성 none, 색, 길이, inherit none 모든요소상속하지않음지정불가 Visual Win IE 4/5/5.5/6, Mozilla, Firefox, Netscape 4/6/7, Mac IE 4/5 없음 26 / 58

27 문자간격, 단어간격속성 12.2 글꼴및텍스트 텍스트의문자간격 (letter-spacing) 을지정하기위한속성 normal, 길이, inherit normal 모든요소상속지정불가 Visual Netscape 4 Mac IE 4/5 27 / 58

28 문자간격, 단어간격속성 12.2 글꼴및텍스트 텍스트의단어간격 (word-spacing) 을지정하기위한속성 normal, 길이, inherit normal 모든요소상속지정불가 Visual Win IE 4/5/5.5, Netscape 4 없음 28 / 58

29 대소문자변환및공백처리 12.2 글꼴및텍스트 텍스트의대소문자변환 (text-transform) 을위한속성 capitalize, uppercase, lowercase, none, inherit none 모든요소상속지정불가 Visual Netscape 4 없음 29 / 58

30 대소문자변환및공백처리 12.2 글꼴및텍스트 텍스트의공백처리방법 (white-spacing) 을지정하기위한속성 normal, pre, nowrap, inherit none 모든요소상속지정불가 Visual Win IE 4/5, Mac IE 4 Win IE 5.5, Netscape 4 30 / 58

31 표및사용자인터페이스 표캡션의위치를지정하기위한속성 관련요소의레이아웃 (table-layout layout 속성 ) 보더표시모델 (border-collapse 속성 ) 셀사이공간 (border-spacing 속성 ) 목록마커종류 (list-style style-type type 속성 ) 목록마커이미지 (list-style style-image 속성 ) 목록마커위치 (list-style style-position 속성 ) 목록관련속성의일괄지정 (list-style style 속성 ) 커서속성 (cursor 속성 ) 아웃라인

32 표캡션의위치를지정하기위한속성 12.3 표및사용자인터페이스 표캡션의위치를지정하기위한속성 top, bottom, left, right, inherit top caption 요소상속지정불가 Visual Win IE 4, 5, 5.5, 6, Netscape 4, Mac IE 4/5 Netscape 6, Opera 6/7, safari 32 / 58

33 관련요소의레이아웃 (table-layout layout 속성 ) 12.3 표및사용자인터페이스 테이블관련요소의레이아웃방법을지정하기위한속성 top, bottom, left, right, inherit top caption 요소상속지정불가 Visual Win IE 4, 5, 5.5, 6, Netscape 4, Mac IE 4/5 Netscape 6, Opera 6/7, safari 33 / 58

34 보더표시모델 (border-collapse 속성 ) 12.3 표및사용자인터페이스 테이블의보더표시모델을지정하기위한속성 collapse, separate, inherit collapse (CSS2.1 권고후보에서는 separate로변경 ) table요소상속지정불가 Visual Win IE 4, Netscape 4/6, Mac IE 4/5 없음 34 / 58

35 셀사이공간 (border-spacing 속성 ) 12.3 표및사용자인터페이스 인접한셀의보더사이의공간을지정하기위한속성 길이값, inherit 0 table요소상속지정불가 Visual Win IE 4/5/5.5/6, Netscape 4, Mac IE 4/5 없음 35 / 58

36 12.3 표및사용자인터페이스 목록마커종류 (list-style style-type type 속성 ) 목록마커의종류를지정하기위한속성 disc, circle, square, decimal, decimal-leading-zero, lowerroman, upper-roman, lower-greek, lower-alpha, lower-latin, upper-alpha, upper, atin, hebrew, arme-nian, georgian, cjkideographic, hiragana, katakana, hiragana-iroha, katakanairoha, none, inherit disc display 값이 list-item 인요소 (li 요소 ) 상속 지정불가 Visual 없음 Win IE 4/5/5.5/6, Netscape 4, Opera 6/7/8, Mac IE 4/5, Safari 36 / 58

37 목록마커이미지 (list-style style-image 속성 ) 12.3 표및사용자인터페이스 목록마커이미지를지정하기위한속성 URI, none, inherit none display 값이 list-item 인요소 (li요소) 상속지정불가 Visual Netscape 4 Mac IE 4/5 37 / 58

38 목록마커위치 (list-style style-position 속성 ) 12.3 표및사용자인터페이스 목록마커의위치를지정하기위한속성 inside, outside, inherit outside display 값이 list-item 인요소 (li요소) 상속지정불가 Visual Netscape 4, Mac IE 4 Win IE 4 38 / 58

39 12.3 표및사용자인터페이스 목록관련속성의일괄지정 (list-style style 속성 ) 목록관련속성을일괄지정하기위한속성 list-style-type, list-style-image, list-styleposition, inherit 정의되지않음 display 값이 list-item 인요소 (li요소) 상속지정불가 Visual 없음 Win IE 4/5/5.5/6, Netscape 4, Opera 6/7/8, Mac IE 4/5 39 / 58

40 커서속성 (cursor 속성 ) 12.3 표및사용자인터페이스 커서의종류를지정하기위한속성 URI, auto, crosshair, default, pointer, move, e- resize, ne-resize, nw-resize, n-resize, seresize, swresize, s-resize, w-resize, text, wait, help, inherit auto 모든요소 상속 지정불가 Visual, Interactive Netscape 4, Opera 6 Win IE 4/5/5.5, Mac IE 4 40 / 58

41 12.3 표및사용자인터페이스 아웃라인 아웃라인의굵기 (outline-width) 를지정하기위한속성 thin, medium, thick, 길이, inherit medium 모든요소상속하지않음지정불가 Visual, Interactive Win IE 4/5/5.5/6, Mozilla, Firefox, Netscape 4/6/7/8, Opera 6, Mac IE 4 Safari 41 / 58

42 12.3 표및사용자인터페이스 아웃라인 아웃라인의형태 (outline-style) 를지정하기위한속성 none, dotted, dashed, solid, double, groove, ridge, inset, outset, inherit none 모든요소상속하지않음지정불가 Visual, Interactive Win IE 4/5/5.5/6, Mozilla, Firefox, Netscape 4/6/7/8, Opera 6, Mac IE 4 Safari 42 / 58

43 12.3 표및사용자인터페이스 아웃라인 아웃라인의색 (outline-color) 을지정하기위한속성 색, invert, inherit invert 모든요소상속하지않음지정불가 Visual, Interactive Win IE 4/5/5.5/6, Mozilla, Firefox, Netscape 4/6/7/8, Opera 6, Mac IE 4 Safari 43 / 58

44 12.3 표및사용자인터페이스 아웃라인 아웃라인관련속성 (outline) 을일괄지정하기위한속성 outline-color, outline-style, outline-width, inherit 각속성참조모든요소상속하지않음지정불가 Visual, Interactive Win IE 4/5/5.5/6, Mozilla, Firefox, Netscape 4/6/7/8, Opera 6, Mac IE 4 Safari 44 / 58

45 음성스타일시트 Volume 속성 Speak 속성 Speak-punctuation punctuation 속성 Speak-numeral 속성 Pause 속성 Pause-before 속성 Pause-after after 속성 Cue 속성 Play-during 속성 Elevation 속성 Voice-family 속성

46 12.4 음성스타일시트 Volume 속성 요소의음량크기를지정하기위한속성 값기본값적용대상상속여부퍼센테이지미디어 수치, 백분율, silent, x-soft, soft, medium, loud, x-loud, inherit medium 모든요소상속지정불가 aural 수치 : '0~100' 사이의수치를지정. '0' 은가장작은음량이며 '100' 은가장큰음량백분율 : 백분율 (%) 값을지정. 부모요소를기준으로계산 Silent : 소리가나지않도록지정. 값 '0' 는 'silent' 와같은것을의미하지않음 x-soft : 무척작게지정. '0' 과같음. Soft : 작게지정. '25' 와같음. medium : 보통으로지정. '50' 과같음. loud : 크게지정. '75' 와같음. x-loud : 무척크게지정. '100' 과같음. inherit : 부모요소의값을상속하도록지정. 46 / 58

47 12.4 음성스타일시트 Speak 속성 요소를소리로출력할형식을지정하기위한속성 값기본값적용대상상속여부퍼센테이지미디어 normal, none, spell-out, inherit normal 모든요소상속지정불가 aural none : 소리로출력하지않도록지정 normal : 정상적으로출력하도록지정 spell-out : 철자글자의철자를한자씩읽도록지정 ( 예 : we - 더블유아이 ) inherit : 부모요소의값을상속하도록지정 47 / 58

48 12.4 음성스타일시트 Speak-punctuation punctuation 속성 값기본값적용대상상속여부퍼센테이지미디어 code, none, inherit none 모든요소상속지정불가 aural code : 쎄미코론들, 대괄호들과같은구둣점이말해짐 none : 구둣점이말해지지않으나, 그대신여러가지잠간멈춤 pause 자연스럽게표현 inherit : 부모요소의값을상속하도록지정 48 / 58

49 12.4 음성스타일시트 Speak-numeral 속성 값기본값적용대상상속여부퍼센테이지미디어 digits, continuous, inherit continuous 모든요소상속지정불가 aural digits : 수치를개별적인숫자들로말함. "237" 은 " 이삼칠 " 로말해짐 continuous : 전체수치로말해짐. "237" 은 " 이백삼십칠 " 로말해짐. 대표하는단어들은언어에따라다름 inherit : 부모요소의값을상속하도록지정 49 / 58

50 12.4 음성스타일시트 Pause 속성 요소를말할때잠시멈춤도록지정하기위한속성 값기본값적용대상상속여부퍼센테이지미디어 시간, 백분율, inherit 사용도구에의존모든요소상속불가 pause-before와 pause-after 참조 aural 시간 : 1/1000 초단위로지정 백분율 : 'speech-rate' 를기준으로백분율값을지정 inherit : 부모요소의값을상속하도록지정 50 / 58

51 12.4 음성스타일시트 Pause-before 속성 요소를말할때앞에서잠시멈추도록지정하기위한속성 값기본값적용대상상속여부퍼센테이지미디어 시간, 백분율, inherit 사용도구에의존모든요소상속불가 prose 참조 aural 시간 : 1/1000 초단위로지정 백분율 : 'speech-rate' 를기준으로백분율값을지정 inherit : 부모요소의값을상속하도록지정 51 / 58

52 12.4 음성스타일시트 Pause-after after 속성 요소를말할때뒤에서잠시멈추도록지정하기위한속성 값기본값적용대상상속여부퍼센테이지미디어 시간, 백분율, inherit 사용도구에의존모든요소상속불가 prose 참조 aural 시간 : 1/1000 초단위로지정 백분율 : 'speech-rate' 를기준으로백분율값을지정 inherit : 부모요소의값을상속하도록지정 52 / 58

53 12.4 음성스타일시트 Cue 속성 요소의앞 / 뒤에큐소리를추가하는단축속성 값기본값적용대상상속여부퍼센테이지미디어 cue-before, cue-after, inherit 개별속성의기본값참조모든요소상속불가사용불가 aural uri : 오디오파일의경로를지정 none : 오디오파일의경로를지정하지않음 inherit : 부모요소의값을상속하도록지정 53 / 58

54 12.4 음성스타일시트 Play-during 속성 요소를말할때, 배경으로들릴소리를지정하는속성 값기본값적용대상상속여부퍼센테이지미디어 uri, mix, repeat, auto, none, inherit auto 생성된내용을? 제외한모든요소상속불가사용불가 aural uri : 배경음으로사용할파일의경로를입력 mix : 배경음과요소의소리가혼합해서들리도록지정 repeat : 배경음이반복되도록지정 auto : 배경음이자동으로반복되도록지정 none : 배경음을지정하지않음 inherit : 부모요소의값을상속하도록지정 54 / 58

55 12.4 음성스타일시트 Elevation 속성 값기본값적용대상상속여부퍼센테이지미디어 각도, below, level, above, higher, lower, inherit level 모든요소상속불가사용불가 aural 각도 : '-90deg' 와 '90deg' 사이의각도로높이를지정. '0deg' 는수평앞을의미, '90deg' 는직접적인머리위를의미, '-90deg' 직접아래를의미 below : '-90deg' 와같음. level : '0deg' 와같음. above : '90deg' 와같음. higher : 현재의높이에 10deg를가산 lower : 현재의높이에서 10deg를감산 inherit : 부모요소의값을상속하도록지정 55 / 58

56 12.4 음성스타일시트 Voice-family 속성 값기본값적용대상상속여부퍼센테이지미디어 specific-voice, generic-voice, inherit 사용도구에의존모든요소상속사용불가 aural generic-voice 값들은음성가족 voice family 이며, 가능한값들은 'male', 'female', 와 'child specific-voice 값들은특정인스탄스 ( 예 : comedian, trinoids, carlos, lani) inherit : 부모요소의값을상속하도록지정 56 / 58

57 과제 팀과제 - 프로젝트페이지 (10 페이지정도 : 사용자입력페이지포함 ) 구현 구현페이지에대하여 CSS 기술을적용하기 개인과제 - 가족소개페이지 (3 페이지정도 : 사용자입력페이지포함 ) 구현 구현페이지에대하여 CSS 기술을적용하기 57 / 58

58 참고문헌 제 2 회웹접근성경진대회개발자교육과정교재, 한국정보문화진흥원, 2007 민간부문의웹접근성을어떻게높일것인가토론회자료집, 한국정보문화진흥원, 2006 웹표준교과서, 마시코타카히로, 디지털미디어리서치, 2007 제프리젤드만의웹표준가이드, 위키북스, Jeffrey Zeldman Head First HTML with CSS & XHTML, 에릭프리먼외, 한빛미디어, 2006 실용예제로배우는웹표준, 댄씨더홈, 에이콘출판, 2005 정보통신접근성향상표준화포럼 58 / 58

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

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

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

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

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

More information

<3036B0AD D4C5F584D4C5FC0CEC5CDB3DDBAB8C3E6C7D0BDC0C0DAB7E12E687770>

<3036B0AD D4C5F584D4C5FC0CEC5CDB3DDBAB8C3E6C7D0BDC0C0DAB7E12E687770> HTML/XML 인터넷보충학습자료 - 1 - (1) 글자색상 : color 속성사용 - 태그의 color 속성과같은역할을한다. (2) 배경지정 : background-color 속성사용. - HTML의 bgcolor 속성과같은역할. bgcolor 속성은일정한태그에만한정되어있지만 background-color 속성은어떤태그에서도모두적용된다.

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

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

쉽게 풀어쓴 C 프로그래밍

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

More information

e-비즈니스 전략 수립

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

More information

쉽게 풀어쓴 C 프로그래밍

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

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

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 : 준비학습 2: 학습내용 11장. 12장. 이미지, 목록, 하이퍼링크스타일 13장. 테두리, 폼양식관련스타일과레이어 14장. 필터효과와 활용하기 : 11 장. 학습내용 개요와삽입법 선택자 글꼴 / 문단관련스타일 개요 Cascading Style Sheets 의약자 계단형스타일시트 라고한다. 의표준화작업과신기술및팁을제공하는 W3C 에서 1996 년 레벨 1

More information

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 HTML5 웹프로그래밍입문 4 장. CSS3 스타일시트기초 1 목차 4.1 CSS3 시작하기 4.2 CSS 기본사용법 4.3 문자와색상지정하기 4.4 목록과표장식하기 2 4.1 CSS3 시작하기 4.1.1 스타일시트와 CSS3 기본개념 4.1.2 CSS 속성선언 4.1.3 문서일부분에 CSS 속성설정 3 스타일시트와 CSS3 기본개념 스타일시트란? 웹문서의출력될외형스타일

More information

<3035B0AD D4C5F584D4C5FC0CEC5CDB3DDBAB8C3E6C7D0BDC0C0DAB7E12E687770>

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

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

인켈(국문)pdf.pdf

인켈(국문)pdf.pdf M F - 2 5 0 Portable Digital Music Player FM PRESET STEREOMONO FM FM FM FM EQ PC Install Disc MP3/FM Program U S B P C Firmware Upgrade General Repeat Mode FM Band Sleep Time Power Off Time Resume Load

More information

PowerPoint 프레젠테이션

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

More information

예스폼 프리미엄 템플릿

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

More information

Jwplayer 요즘 웹에서 동영상 재생을 목적으로 많이 쓰이는 jwplayer의 설치와 사용하기 입니다. jwplayer홈페이지 : http://www.longtailvideo.com 위의 홈페이지에 가시면 JWplayer를 다운 받으실 수 있습니다. 현재 5.1버전

Jwplayer 요즘 웹에서 동영상 재생을 목적으로 많이 쓰이는 jwplayer의 설치와 사용하기 입니다. jwplayer홈페이지 : http://www.longtailvideo.com 위의 홈페이지에 가시면 JWplayer를 다운 받으실 수 있습니다. 현재 5.1버전 Jwplayer Guide Jwplayer 요즘 웹에서 동영상 재생을 목적으로 많이 쓰이는 jwplayer의 설치와 사용하기 입니다. jwplayer홈페이지 : http://www.longtailvideo.com 위의 홈페이지에 가시면 JWplayer를 다운 받으실 수 있습니다. 현재 5.1버전까지 나왔으며 편리함을 위해서 아래를 링크를 걸어둡니다 [다운로드]

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

What Is CSS? Stands for Cascading Style Sheets. Is a simple mechanism for adding style (e.g. fonts, colors, spacing) to Web documents. Styles define h

What Is CSS? Stands for Cascading Style Sheets. Is a simple mechanism for adding style (e.g. fonts, colors, spacing) to Web documents. Styles define h What is CSS? Bok, Jong Soon jongsoon.bok@gmail.com www.javaexpert.co.kr What Is CSS? Stands for Cascading Style Sheets. Is a simple mechanism for adding style (e.g. fonts, colors, spacing) to Web documents.

More information

CAD 화면상에 동그란 원형 도형이 생성되었습니다. 화면상에 나타난 원형은 반지름 500인 도형입니다. 하지만 반지름이 500이라는 것은 작도자만 알고 있는 사실입니다. 반지름이 500이라는 것을 클라이언트와 작업자들에게 알려주기 위 해서는 반드시 치수가 필요하겠죠?

CAD 화면상에 동그란 원형 도형이 생성되었습니다. 화면상에 나타난 원형은 반지름 500인 도형입니다. 하지만 반지름이 500이라는 것은 작도자만 알고 있는 사실입니다. 반지름이 500이라는 것을 클라이언트와 작업자들에게 알려주기 위 해서는 반드시 치수가 필요하겠죠? 실무 인테리어를 위한 CAD 프로그램 활용 인테리어 도면 작도에 꼭 필요한 명령어 60개 Ⅷ 이번 호에서는 DIMRADIUS, DIMANGULAR, DIMTEDIT, DIMSTYLE, QLEADER, 5개의 명령어를 익히도록 하겠다. 라경모 온라인 설계 서비스 업체 '도면창고' 대 표를 지낸 바 있으며, 현재 나인슈타인 을 설립해 대표 를맡고있다. E-Mail

More information

Javascript

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

More information

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

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

More information

PHP & ASP

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

More information

USER GUIDE

USER GUIDE Solution Package Volume II DATABASE MIGRATION 2010. 1. 9. U.Tu System 1 U.Tu System SeeMAGMA SYSTEM 차 례 1. INPUT & OUTPUT DATABASE LAYOUT...2 2. IPO 중 VB DATA DEFINE 자동작성...4 3. DATABASE UNLOAD...6 4.

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

쉽게 풀어쓴 C 프로그래밍

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

More information

adfasdfasfdasfasfadf

adfasdfasfdasfasfadf C 4.5 Source code Pt.3 ISL / 강한솔 2019-04-10 Index Tree structure Build.h Tree.h St-thresh.h 2 Tree structure *Concpets : Node, Branch, Leaf, Subtree, Attribute, Attribute Value, Class Play, Don't Play.

More information

Orcad Capture 9.x

Orcad Capture 9.x OrCAD Capture Workbook (Ver 10.xx) 0 Capture 1 2 3 Capture for window 4.opj ( OrCAD Project file) Design file Programe link file..dsn (OrCAD Design file) Design file..olb (OrCAD Library file) file..upd

More information

LCD Display

LCD Display LCD Display SyncMaster 460DRn, 460DR VCR DVD DTV HDMI DVI to HDMI LAN USB (MDC: Multiple Display Control) PC. PC RS-232C. PC (Serial port) (Serial port) RS-232C.. > > Multiple Display

More information

<!DOCTYPE html> <html> <head> #p1{background:#ff0000;} 1 배경색을 16진수지정방식사용 #p2{background:rgb(255,0,0);} 2 배경색을 rgb 지정방식사용 #p3{background:rgba(255,0,0,0

<!DOCTYPE html> <html> <head> #p1{background:#ff0000;} 1 배경색을 16진수지정방식사용 #p2{background:rgb(255,0,0);} 2 배경색을 rgb 지정방식사용 #p3{background:rgba(255,0,0,0 1. 색상이해하기 1.1 색모델 Ÿ RGB 색모델 R( 빨강 ), G( 녹색 ), B( 파랑 ) 를삼원색으로하는색모델로서삼원자극이론에근거한색모델이다. 16진수색상지정방식으로 rgb() 색상지정방식과 RGBA() 색상방식지정방식이있다. Ÿ HSL 색모델 H( 색조 ), S( 채도 ), L( 밝기 ) 의쌍으로색상지정이다. HSL() 색상지정방식 HSLA() 색상지정방식이있다.

More information

글자가족 type family AG 안상수체 2012 ExtraLight AG안상수체2012 Light AG안상수체2012 Medium AG안상수체2012 Bold AG안상수체2012 ExtraBlod

글자가족 type family AG 안상수체 2012 ExtraLight AG안상수체2012 Light AG안상수체2012 Medium AG안상수체2012 Bold AG안상수체2012 ExtraBlod AG 글꼴미리보기 AG type overview AG 안상수체 2012 안상수체는 1985년안상수가디자인한탈네모틀글꼴이다. 한글쪽자는수직선, 수평선, 사선, 정원의기하학모양이며, 홀자기둥이받침의정가운데맞닿아있는것이특징이다. AG 안상수체 2012는기존안상수체에서로마자, 기호활자를다듬고굵기를판올림한것이다. 글자가족은아주가는 (EL), 가는 (L), 중간 (M),

More information

미쓰리 파워포인트

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

More information

#KM-1751/1791..

#KM-1751/1791.. PARTS BOOK KM-1751 KM-1791 Code Lubrication Type Code Application Code Hook Code Trimming 0 S M Semi-Dry Type Micro Lubrication Type Dry Head F G Foundation General materials None L Standard Hook Large

More information

쉽게 풀어쓴 C 프로그래밍

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

More information

Ÿ column-rule 속성은단사이의구분선을표현하기위한속성으로 column-rule-color, column-rule-style, column-rule-width 속성을한번에지정할수있다. 1.4 단의확장 Ÿ column-span 속성은다단을구성할때해당요소가얼마나많은단

Ÿ column-rule 속성은단사이의구분선을표현하기위한속성으로 column-rule-color, column-rule-style, column-rule-width 속성을한번에지정할수있다. 1.4 단의확장 Ÿ column-span 속성은다단을구성할때해당요소가얼마나많은단 1. 다단레이아웃 1.1 다단문서의개수및폭지정 Ÿ column-count 속성은다단을구성할때단의개수를지정하는속성이다. Ÿ column-width 속성은단의폭을지정하는속성이다. Ÿ column-width와 column-count 속성은동시에 auto 속성으로지정할수없다. Ÿ columns 속성은단의개수와폭을한번에지정하기속성이다. Ÿ 다단관련속성의사용은벤더프리픽스가필요하다.

More information

쉽게 풀어쓴 C 프로그래밍

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

More information

Abstract Musculoskeletal Symptoms and Related Factors for Nurses and Radiological Technologists Wearing a Lead Apron for Radiation Pro t e c t i o n Jung-Im Yoo, Jung-Wan Koo 1 ) Angio Unit, Team of Radiology,

More information

일반인을 위한 전자책 제작 방법

일반인을 위한 전자책 제작 방법 국립중앙도서관 디지털 정보활용능력 교육 이펍(ePub) 제작 입문 2015. 6. 강사 : 최 현 이북스펍 대표 (http://ebookspub.co.kr) - 1 - - 강의 내용 - 1. epub 이란 무엇인가 1.1. 전자책 출판 프로세스 이해 1.2. 전자책의 다양한 형태와 제작방식 1.2. epub 개념 이해 및 제작툴 종류 2. epub 제작툴 소개

More information

ez-md+_manual01

ez-md+_manual01 ez-md+ HDMI/SDI Cross Converter with Audio Mux/Demux Operation manual REVISION NUMBER: 1.0.0 DISTRIBUTION DATE: NOVEMBER. 2018 저작권 알림 Copyright 2006~2018 LUMANTEK Co., Ltd. All Rights Reserved 루먼텍 사에서

More information

웹프로그래밍응용

웹프로그래밍응용 7 주차 CSS 다루기 1. CSS3 개요 2. 선택자 3. 스타일시트선언 4. 스타일속성 5. 박스모델 6. CSS3 레이아웃 7. 확장폰트요약 >> 학습목표

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 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

chap 5: Trees

chap 5: Trees 5. Threaded Binary Tree 기본개념 n 개의노드를갖는이진트리에는 2n 개의링크가존재 2n 개의링크중에 n + 1 개의링크값은 null Null 링크를다른노드에대한포인터로대체 Threads Thread 의이용 ptr left_child = NULL 일경우, ptr left_child 를 ptr 의 inorder predecessor 를가리키도록변경

More information

1 CSS 개요 1.1 DHTML(CSS) 란? Dynamic Hyper Text Markup Language 의약자이다. 홈페이지를좀더다이나믹하게만들고자고안해낸방법중하나이다. Nevigator 의 DHTML 은 JSS 라불리고 Explorer 의 DHTML 은 CSS

1 CSS 개요 1.1 DHTML(CSS) 란? Dynamic Hyper Text Markup Language 의약자이다. 홈페이지를좀더다이나믹하게만들고자고안해낸방법중하나이다. Nevigator 의 DHTML 은 JSS 라불리고 Explorer 의 DHTML 은 CSS jtc 와함께하는수월한 DHTML(CSS) http://www.jobtc.kr 훈련교사박원기 1 CSS 개요 1.1 DHTML(CSS) 란? Dynamic Hyper Text Markup Language 의약자이다. 홈페이지를좀더다이나믹하게만들고자고안해낸방법중하나이다. Nevigator 의 DHTML 은 JSS 라불리고 Explorer 의 DHTML 은 CSS

More information

3장

3장 C H A P T E R 03 CHAPTER 03 03-01 03-01-01 Win m1 f1 e4 e5 e6 o8 Mac m1 f1 s1.2 o8 Linux m1 f1 k3 o8 AJAX

More information

BSC Discussion 1

BSC Discussion 1 Copyright 2006 by Human Consulting Group INC. All Rights Reserved. No Part of This Publication May Be Reproduced, Stored in a Retrieval System, or Transmitted in Any Form or by Any Means Electronic, Mechanical,

More information

www.ezled.co.kr EZ COB LIGHTING 2015 SUNIL ELECOMM NEW COB 01 COB (Chip-on-Board) LED란? COB (CHIP ON BOARD) 한 개의 Module에 여러 개의 LED Chip을 Packaging한 것으로 여러 개의 부품을 하나의 기판 위에 일체화함으로써 발광부가 집약적으로 설계되어 고출력의

More information

SASS FOR WEB DESIGNERS By A Book Apart Copyright 2014 Dan Cederholm Korean Translation Edition 2014 Webactually Korea, Inc. All rights reserved. 이 책의

SASS FOR WEB DESIGNERS By A Book Apart Copyright 2014 Dan Cederholm Korean Translation Edition 2014 Webactually Korea, Inc. All rights reserved. 이 책의 댄 시더홈 Dan Cederholm 웹디자이너를 위한 SASS SASS FOR WEB DESIGNERS By A Book Apart Copyright 2014 Dan Cederholm Korean Translation Edition 2014 Webactually Korea, Inc. All rights reserved. 이 책의 한국어판 저작권은 저작권자와의

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

쉽게 풀어쓴 C 프로그래밍

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

More information

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

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

More information

목 차 Ⅰ. 일반사항 1 Ⅱ. 특기사항 3 Ⅲ. 물품내역 및 세부규격 8 Ⅳ. 주의사항 11-2 -

목 차 Ⅰ. 일반사항 1 Ⅱ. 특기사항 3 Ⅲ. 물품내역 및 세부규격 8 Ⅳ. 주의사항 11-2 - 대전마케팅공사 경영정보포털 구축 사업 패키지 소프트웨어 2식 구매 설치 시방서 (소프트웨어 2식) 2016. 06. 대전마케팅공사 경 영 지 원 파 트 목 차 Ⅰ. 일반사항 1 Ⅱ. 특기사항 3 Ⅲ. 물품내역 및 세부규격 8 Ⅳ. 주의사항 11-2 - Ⅰ. 일반사항 1. 목적 본 시방서는 대전마케팅공사가 추진하고 있는 경영정보포털 사업의 패키지 소프트웨어 도입을

More information

Microsoft PowerPoint - 3ÀÏ°_º¯¼ö¿Í »ó¼ö.ppt

Microsoft PowerPoint - 3ÀÏ°_º¯¼ö¿Í »ó¼ö.ppt 변수와상수 1 변수란무엇인가? 변수 : 정보 (data) 를저장하는컴퓨터내의특정위치 ( 임시저장공간 ) 메모리, register 메모리주소 101 번지 102 번지 변수의크기에따라 주로 byte 단위 메모리 2 기본적인변수형및변수의크기 변수의크기 해당컴퓨터에서는항상일정 컴퓨터마다다를수있음 short

More information

Grouping Selectors To minimize the code, you can group selectors.

Grouping Selectors To minimize the code, you can group selectors. CSS Advanced Bok, Jong Soon jongsoon.bok@gmail.com www.javaexpert.co.kr Grouping Selectors To minimize the code, you can group selectors. Nesting Selectors It is possible to apply a style for a selector

More information

OCW_C언어 기초

OCW_C언어 기초 초보프로그래머를위한 C 언어기초 4 장 : 연산자 2012 년 이은주 학습목표 수식의개념과연산자및피연산자에대한학습 C 의알아보기 연산자의우선순위와결합방향에대하여알아보기 2 목차 연산자의기본개념 수식 연산자와피연산자 산술연산자 / 증감연산자 관계연산자 / 논리연산자 비트연산자 / 대입연산자연산자의우선순위와결합방향 조건연산자 / 형변환연산자 연산자의우선순위 연산자의결합방향

More information

전립선암발생률추정과관련요인분석 : The Korean Cancer Prevention Study-II (KCPS-II)

전립선암발생률추정과관련요인분석 : The Korean Cancer Prevention Study-II (KCPS-II) 전립선암발생률추정과관련요인분석 : The Korean Cancer Prevention Study-II (KCPS-II) 전립선암발생률추정과관련요인분석 : The Korean Cancer Prevention Study-II (KCPS-II) - i - - ii - - iii - - iv - - v - - vi - - vii - - viii - - ix - -

More information

Week3

Week3 2015 Week 03 / _ Assignment 1 Flow Assignment 1 Hello Processing 1. Hello,,,, 2. Shape rect() ellipse() 3. Color stroke() fill() color selector background() 4 Hello Processing 4. Interaction setup() draw()

More information

manual pdfÃÖÁ¾

manual pdfÃÖÁ¾ www.oracom.co.kr 1 2 Plug & Play Windows 98SE Windows, Linux, Mac 3 4 5 6 Quick Guide Windows 2000 / ME / XP USB USB MP3, WMA HOLD Windows 98SE "Windows 98SE device driver 7 8 9 10 EQ FM LCD SCN(SCAN)

More information

2011년 10월 초판 c 2011 Sony Corporation. All rights reserved. 서면 허가 없이 전체 또는 일부를 복제하는 것을 금합니다. 기능 및 규격은 통보 없이 변경될 수 있습니다. Sony와 Sony 로고는 Sony의 상표입니다. G L

2011년 10월 초판 c 2011 Sony Corporation. All rights reserved. 서면 허가 없이 전체 또는 일부를 복제하는 것을 금합니다. 기능 및 규격은 통보 없이 변경될 수 있습니다. Sony와 Sony 로고는 Sony의 상표입니다. G L HXR-NX3D1용 3D 워크플로 가이드북 2011년 10월 초판 c 2011 Sony Corporation. All rights reserved. 서면 허가 없이 전체 또는 일부를 복제하는 것을 금합니다. 기능 및 규격은 통보 없이 변경될 수 있습니다. Sony와 Sony 로고는 Sony의 상표입니다. G Lens, Exmor, InfoLITHIUM, Memory

More information

12 강. 문자출력 Direct3D 에서는문자를출력하기위해서 LPD3DXFONT 객체를사용한다 LPD3DXFONT 객체생성과초기화 LPD3DXFONT 객체를생성하고초기화하는함수로 D3DXCreateFont() 가있다. HRESULT D3DXCreateFont

12 강. 문자출력 Direct3D 에서는문자를출력하기위해서 LPD3DXFONT 객체를사용한다 LPD3DXFONT 객체생성과초기화 LPD3DXFONT 객체를생성하고초기화하는함수로 D3DXCreateFont() 가있다. HRESULT D3DXCreateFont 12 강. 문자출력 Direct3D 에서는문자를출력하기위해서 LPD3DXFONT 객체를사용한다. 12.1 LPD3DXFONT 객체생성과초기화 LPD3DXFONT 객체를생성하고초기화하는함수로 D3DXCreateFont() 가있다. HRESULT D3DXCreateFont( in LPDIRECT3DDEVICE9 pdevice, in INT Height, in UINT

More information

YV-150-S.CHINESE1.0-1

YV-150-S.CHINESE1.0-1 Voice REC YV-50 5 C(95 F) ( ). 80 C(76 F). ......4....6...7...7...0............4. Samsung Media studio...8...9 Media studio...0 Media studio......4...5 TTS...6 TTS...7 TS File...9....0...0......4...5...5...8

More information

1

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

More information

27 2, 17-31, , * ** ***,. K 1 2 2,.,,,.,.,.,,.,. :,,, : 2009/08/19 : 2009/09/09 : 2009/09/30 * 2007 ** *** ( :

27 2, 17-31, , * ** ***,. K 1 2 2,.,,,.,.,.,,.,. :,,, : 2009/08/19 : 2009/09/09 : 2009/09/30 * 2007 ** *** ( : 27 2, 17-31, 2009. -, * ** ***,. K 1 2 2,.,,,.,.,.,,.,. :,,, : 2009/08/19 : 2009/09/09 : 2009/09/30 * 2007 ** *** (: dminkim@cau.ac.kr) 18 한국교육문제연구제 27 권 2 호, 2009. Ⅰ. (,,, 2004). (,, 2006).,,, (Myrick,

More information

untitled

untitled R&S Power Viewer Plus For NRP Sensor 1.... 3 2....5 3....6 4. R&S NRP...7 -.7 - PC..7 - R&S NRP-Z4...8 - R&S NRP-Z3... 8 5. Rohde & Schwarz 10 6. R&S Power Viewer Plus.. 11 6.1...12 6.2....13 - File Menu...

More information

iloom STUDY 2012(<B300><C6A9><B7C9>).pdf

iloom STUDY 2012(<B300><C6A9><B7C9>).pdf 2012 STUDY FALL / WINTER 2012 STUDY FALL / WINTER CONTENTS 04 INTRO 04 MAKING STORY 06 ILOOM SMART SERVICE 08 KIDS 10 TINKLE2 20 TWINY 28 STUDY 30 LINKI 38 KARAT 42 OLLI 46 REVO 50 ALTUS 56 EDIS 62 NOX

More information

PowerPoint 프레젠테이션

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

More information

Microsoft PowerPoint - HS6000 Full HD Subtitle Generator Module Presentation

Microsoft PowerPoint - HS6000 Full HD Subtitle Generator Module Presentation HS6000 Full HD Subtitle Generator Module High-performance Network DVR Solution Preliminary Product Overview (Without notice, following described technical spec. can be changed) AddPac Technology 2010,

More information

WEB HTML CSS Overview

WEB HTML CSS Overview WEB HTML CSS Overview 2017 spring seminar bloo 오늘의수업은 실습 오늘의수업은 이상 : 12:40 목표 : 1:00 밤샘 SPARCS 실습 오늘의수업은 근데숙제는많음 화이팅 WEB 2017 spring seminar bloo WEB WEB 의원시적형태 WEB 의원시적형태 질문 못받음 ㅈㅅ HTML 2017 spring seminar

More information

IM-20 4 5 6 7 8 9 10 11 12 Power On Power Off 13 1 4 15 16 17 18 19 20 21 22 23 24 25 26 2 7 28 29 30 31 3 2 Music Voice Settings Delete EQ Repeat LCD Contrast Auto OFF Rec Sample BackLight Return Normal

More information

Solaris Express Developer Edition

Solaris Express Developer Edition Solaris Express Developer Edition : 2008 1 Solaris TM Express Developer Edition Solaris OS. Sun / Solaris, Java, Web 2.0,,. Developer Solaris Express Developer Edition System Requirements. 768MB. SPARC

More information

. "" "",.... :...,,....,.. :..,,,..,,...,.... 2

.  ,.... :...,,....,.. :..,,,..,,...,.... 2 RD-5405 /.. . "" "",.... :...,,....,.. :..,,,..,,...,.... 2 ..,,..,.. (,,,, )......,...,., ( ),,,,.,. (, )..,...... BD/DVD CD TV, VCR,........ (+, -).,,..... 3 ... 2... 3....3... 5... 9... 10...11...11...

More information

UI TASK & KEY EVENT

UI TASK & KEY EVENT 2007. 2. 5 PLATFORM TEAM 정용학 차례 CONTAINER & WIDGET SPECIAL WIDGET 질의응답및토의 2 Container LCD에보여지는화면한개 1개이상의 Widget을가짐 3 Container 초기화과정 ui_init UMP_F_CONTAINERMGR_Initialize UMP_H_CONTAINERMGR_Initialize

More information

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 명품웹프로그래밍 1 2 강의목표 1. CSS3로 HTML 태그가출력되는위치를조절할수있다. 2. CSS3로리스트를예쁘게꾸밀수있다. 3. CSS3로표를예쁘게꾸밀수있다. 4. CSS3로폼을꾸미고사용자의입력에반응하게할수있다. 5. CSS3로애니메이션, 전환 (transition), 변환 (transform) 효과를만들수있다. 배치 3 배치 CSS3 로 HTML 태그가출력되는위치지정

More information

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 20301 실내디자인스튜디오 2 203 Research 2 20302 Design Process 1 2 3 4 5 사무공간디자인에관한 Orientation 사무공간디자인을위한자료조사 사무공간실내디자인사례조사 Bubble diagram 의작성과동선계획 Block layout 의작성과 idea Sketch 6 7 8 9 10 예비평면도의작성 Floor Plan

More information

03 ¸ñÂ÷

03 ¸ñÂ÷ 2010 I 04 I April Family i n t e r v i e w 004 052 008 058 065 076 080 084 2010 + 04 + April 088 092 094 096 098 4 2010 + April 5 6 2010 + April 7 letter 01 letter 02 letter 03 letter 04 letter 05 letter

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

#KM-1750/1790..

#KM-1750/1790.. PARTS BOOK KM-1750 KM-1790 Code Lubrication Type Code Application Code Hook Code Trimming 0 S M Semi-Dry Type Micro Lubrication Type Dry Head F G Foundation General materials None L Standard Hook Large

More information

Cover_KD-R646[U]004A_1.indd 2 2

Cover_KD-R646[U]004A_1.indd 2 2 KD-DV5606 LVT2490-001A [UP] Cover_KD-R646[U]004A_1.indd 2 2 3 1 4 2 3 5 6 1 2 3 4 5 6 7 4 * 1 * 2 * 3 * 1 * 2 * 3 5 1 FM/AM DISC/USB 2 3 FM=AM* 1 =DISC* 2 =USB* 2 =AUX IN* 1 = 4 DISC/USB 5 * 3 FM/AM DISC/USB

More information

Journal of Educational Innovation Research 2019, Vol. 29, No. 1, pp DOI: * Suggestions of Ways

Journal of Educational Innovation Research 2019, Vol. 29, No. 1, pp DOI:   * Suggestions of Ways Journal of Educational Innovation Research 2019, Vol. 29, No. 1, pp.65-89 DOI: http://dx.doi.org/10.21024/pnuedi.29.1.201903.65 * Suggestions of Ways to Improve Teaching Practicum Based on the Experiences

More information

PowerSHAPE 따라하기 Calculate 버튼을 클릭한다. Close 버튼을 눌러 미러 릴리프 페이지를 닫는다. D 화면을 보기 위하여 F 키를 누른다. - 모델이 다음과 같이 보이게 될 것이다. 열매 만들기 Shape Editor를 이용하여 열매를 만들어 보도록

PowerSHAPE 따라하기 Calculate 버튼을 클릭한다. Close 버튼을 눌러 미러 릴리프 페이지를 닫는다. D 화면을 보기 위하여 F 키를 누른다. - 모델이 다음과 같이 보이게 될 것이다. 열매 만들기 Shape Editor를 이용하여 열매를 만들어 보도록 PowerSHAPE 따라하기 가구 장식 만들기 이번 호에서는 ArtCAM V를 이용하여 가구 장식물에 대해서 D 조각 파트를 생성해 보도록 하겠다. 중심 잎 만들기 투 레일 스윕 기능을 이용하여 개의 잎을 만들어보도록 하겠다. 미리 준비된 Wood Decoration.art 파일을 불러온다. Main Leaves 벡터 레이어를 on 시킨다. 릴리프 탭에 있는

More information

PowerPoint 프레젠테이션

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

More information

EndNote X2 초급 분당차병원도서실사서최근영 ( )

EndNote X2 초급 분당차병원도서실사서최근영 ( ) EndNote X2 초급 2008. 9. 25. 사서최근영 (031-780-5040) EndNote Thomson ISI Research Soft의 bibliographic management Software 2008년 9월현재 X2 Version 사용 참고문헌 (Reference), Image, Fulltext File 등 DB 구축 참고문헌 (Reference),

More information

BY-FDP-4-70.hwp

BY-FDP-4-70.hwp RS-232, RS485 FND Display Module BY-FDP-4-70-XX (Rev 1.0) - 1 - 1. 개요. 본 Display Module은 RS-232, RS-485 겸용입니다. Power : DC24V, DC12V( 주문사양). Max Current : 0.6A 숫자크기 : 58mm(FND Size : 70x47mm 4 개) RS-232,

More information

This page left blank intentionally

This page left blank intentionally User s Manual Manuel d utilisation Bedienungsanleitung Manual de usuario Manuale d'istruzioni Gebruiksaanwijzing Instruções do Proprietário Bruksanvisningens Руководство пользователя Regulatory models:

More information

Microsoft PowerPoint - chap06-1Array.ppt

Microsoft PowerPoint - chap06-1Array.ppt 2010-1 학기프로그래밍입문 (1) chapter 06-1 참고자료 배열 박종혁 Tel: 970-6702 Email: jhpark1@snut.ac.kr 한빛미디어 출처 : 뇌를자극하는 C프로그래밍, 한빛미디어 -1- 배열의선언과사용 같은형태의자료형이많이필요할때배열을사용하면효과적이다. 배열의선언 배열의사용 배열과반복문 배열의초기화 유연성있게배열다루기 한빛미디어

More information

과정명

과정명 CSS (Cascading Style Sheet) 1. CSS 개요 2. CSS Selector, Cascading,Font 3. CSS Table, Positioning 4. CSS Pseudo Class 5. CSS Print 6. CSS Layout - 1 - CSS - 2 - CSS (Cascading Style Sheet) 개요 CSS(Casscading

More information

PowerPoint Template

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

More information

강의 개요

강의 개요 DDL TABLE 을만들자 웹데이터베이스 TABLE 자료가저장되는공간 문자자료의경우 DB 생성시지정한 Character Set 대로저장 Table 생성시 Table 의구조를결정짓는열속성지정 열 (Clumn, Attribute) 은이름과자료형을갖는다. 자료형 : http://dev.mysql.cm/dc/refman/5.1/en/data-types.html TABLE

More information

이명숙초고.hwp

이명숙초고.hwp 우리나라 전래동화와 함께 하는 한국어 교수법 이명숙(동화사랑연구소 교수) 재외동포를 위한 한국어교사여러분! 우리 재외동포2~3세 들에게 자신들의 뿌리를 알게 오랜 언어와 문화적 전통을 가진 대한민족의 정체성을 갖게 해주어 그들이 살고 있는 나라에서 정정당당하게 살 수 있도록 얼마나 노력을 하고 계십니까? 우리나라의 문화를 알게 해주는 방법은 다양하지만 우리나라의

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

Eclipse 와 Firefox 를이용한 Javascript 개발 발표자 : 문경대 11 년 10 월 26 일수요일

Eclipse 와 Firefox 를이용한 Javascript 개발 발표자 : 문경대 11 년 10 월 26 일수요일 Eclipse 와 Firefox 를이용한 Javascript 개발 발표자 : 문경대 Introduce Me!!! Job Jeju National University Student Ubuntu Korean Jeju Community Owner E-Mail: ned3y2k@hanmail.net Blog: http://ned3y2k.wo.tc Facebook: http://www.facebook.com/gyeongdae

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

Microsoft PowerPoint - 강의노트 2.ppt

Microsoft PowerPoint - 강의노트 2.ppt CSS 개요 DHTML+ 자바스크립트프로그래밍 제 2 장스타일시트 (CSS: Cascading Style Sheet) 를이용한화려한 HTML 문서 All right reserved. N part f this lecture nte may be reprduced, in any frm r by any means, withut permissin in writing

More information

BMP 파일 처리

BMP 파일 처리 BMP 파일처리 김성영교수 금오공과대학교 컴퓨터공학과 학습내용 영상반전프로그램제작 2 Inverting images out = 255 - in 3 /* 이프로그램은 8bit gray-scale 영상을입력으로사용하여반전한후동일포맷의영상으로저장한다. */ #include #include #define WIDTHBYTES(bytes)

More information

B _01_M_Korea.indb

B _01_M_Korea.indb DDX7039 B64-3602-00/01 (MV) SRC... 2 2 SRC % % % % 1 2 4 1 5 4 5 2 1 2 6 3 ALL 8 32 9 16:9 LB CD () : Folder : Audio fi SRC 0 0 0 1 2 3 4 5 6 3 SRC SRC 8 9 p q w e 1 2 3 4 5 6 7 SRC SRC SRC 1 2 3

More information

Prototype 분석 - Element 오브젝트 메서드

Prototype 분석 - Element 오브젝트 메서드 Created by Firejune at 2006/09/05 Prototype 분석 - Element 오브젝트 메서드 이 문서는 Backstage of theater.js에서 발췌한 것 입니다. 프로토타입 라이브러리의 엘리먼트 오브젝트 메서드에 대한 내용을 다루는 일부분입니다. 사용성과 편리성에 포커스를 두지 않고 prototype.js 그대로를 분석하여 접근하고

More information

00.1

00.1 HOSPA Chipboard screws with countersunk head Material: Drive: Cross recess PZ galvanized yellow chromatized nickel plated burnished Partly threaded, galvanized or yellow chromatized dk k L d m Head Ø dk

More information

비트와바이트 비트와바이트 비트 (Bit) : 2진수값하나 (0 또는 1) 를저장할수있는최소메모리공간 1비트 2비트 3비트... n비트 2^1 = 2개 2^2 = 4개 2^3 = 8개... 2^n 개 1 바이트는 8 비트 2 2

비트와바이트 비트와바이트 비트 (Bit) : 2진수값하나 (0 또는 1) 를저장할수있는최소메모리공간 1비트 2비트 3비트... n비트 2^1 = 2개 2^2 = 4개 2^3 = 8개... 2^n 개 1 바이트는 8 비트 2 2 비트연산자 1 1 비트와바이트 비트와바이트 비트 (Bit) : 2진수값하나 (0 또는 1) 를저장할수있는최소메모리공간 1비트 2비트 3비트... n비트 2^1 = 2개 2^2 = 4개 2^3 = 8개... 2^n 개 1 바이트는 8 비트 2 2 진수법! 2, 10, 16, 8! 2 : 0~1 ( )! 10 : 0~9 ( )! 16 : 0~9, 9 a, b,

More information