Download presentation
Presentation is loading. Please wait.
1
문단 관련 태그 위지윅과 특수문자 <BODY> 태그로 컬러 문서 만들기 글꼴 관련 태그 목록 관련 태그
04장. 문단, 컬러, 글꼴, 목록 다루기 문단 관련 태그 위지윅과 특수문자 <BODY> 태그로 컬러 문서 만들기 글꼴 관련 태그 목록 관련 태그
2
<p> 태그와 <br> 태그 비교
문단, 컬러, 글꼴, 목록 태그 다루기 – 문단 관련 태그 <br> <p> <div> <h숫자> <center> <p> 태그와 <br> 태그 비교 내용1<p>내용2 = <p>내용1</p>내용2 = 내용1<br><br>내용2
3
<center>내용</center> <p align=center>내용</p>
문단, 컬러, 글꼴, 목록 태그 다루기 – 문단 관련 태그 [내용을 가운데 정렬하는 법] <center>내용</center> <p align=center>내용</p> <div align=center>내용<div> <h4 align=center>내용</h4>
4
문단, 컬러, 글꼴, 목록 태그 다루기 – 위지윅과 특수문자
[자주 사용하는 특수문자] 문자 엔티티 결과 설명 non-breaking space의 약어. 공백문자 하나를 추가한다. < Less than 의 약어. <를 표시한다. > Greater than의 약어. >를 표시한다. & & Ampersand의 약어. &부호를 표시한다. " “ quotation maker의 약어. “를 표시한다. ⓒ Copyright의 약어. 저작권,판권을 표시한다. ™ ™ Trademark의 약어. 상표를 표시한다.
5
문단, 컬러, 글꼴, 목록 태그 다루기 – 위지윅과 특수문자
[<pre> 태그와 <xmp> 태그] <pre> <xmp> 주용도 눈에 보이는 대로 출력 태그를 문자 취급 위지윅 방식 ○ 태그 적용 여부 ×
6
문단, 컬러, 글꼴, 목록 태그 다루기 – <body> 태그
[색상 표기법] HTML 문서에서 색상을 표현하는 방식은 영문의 색상명, 16진수 RGB 값 2가지가 있다. 16진수 표기법은 RGB표기법 이라고도 하는데, R(red) 2자리, G(green) 2자리, B(blue) 2자리 총 6자리로 구성된다. RR GG BB
7
문단, 컬러, 글꼴, 목록 태그 다루기 – <body> 태그
[RGB 컬러 값] 칼라 영문명 16진수 Black #000000 Green #008000 Silver #C0C0C0 Lime #00FF00 Gray #808080 Olive #808000 White #FFFFFF Yellow #FFFF00 Maroon #800000 Navy #000080 Red #FF0000 Blue #0000FF Purple #800080 Teal #008080 Fuchsia #FF00FF Aqua #00FFFF
8
문단, 컬러, 글꼴, 목록 태그 다루기 – <body> 태그
bgcolor background text link vlink alink leftmargin topmargin oncontextmenu onselectstart bgproperties scroll
9
<basefont> 태그와 비교
문단, 컬러, 글꼴, 목록 태그 다루기 – 글꼴 관련 태그 [<font> 태그의 속성] color face size <basefont> 태그와 비교
10
문단, 컬러, 글꼴, 목록 태그 다루기 – 글꼴 관련 태그
[물리적인 글꼴의 종류] 태그 설명 결과 <b> bold(굵은 글자) bold <i> italic(이탤릭체) italic <u> underline(밑줄) underline <strike> strike through(취소선을 표시) strike through <tt> typewriter text(타이핑체) typewriter text <sup> superscript(위첨자) superscript <sub> subscript(아래첨자) subscript <big> big(더 크게) big <small> small(더 작게) small
11
문단, 컬러, 글꼴, 목록 태그 다루기 – 글꼴 관련 태그
[논리적인 글꼴의 종류] 태그 설명 결과 <em> emphasis(강조할 때) 이탤릭체로 표현 emphasis <strong> strong emphasis(강한 강조) 굵은 문자로 표현 strong emphasis <code> code(컴퓨터 코드를 나타낼 때) 고정폭 글자체로 표현 code <samp> sample(샘플 출력할 때) 고정폭 글자체로 표현 sample <kbd> keyboard(키보드의 키 입력을 표현할 때) 고정폭 글자체로 표현 keyboard <var> variable(변수 이름을 지정할 때) 기울임체로 표현 variable <cite> citation(인용구를 나타낼 때) 기울임체로 표현 citation <dfn> defining instance(단어를 정의하거나 사례를 들 때) 기울임체로 표현 defining instance
12
<h숫자> <font size=숫자> <big> <small>
문단, 컬러, 글꼴, 목록 태그 다루기 – 글꼴 관련 태그 [글자크기를 지정하는 태그] <h숫자> <font size=숫자> <big> <small> <basefont>
13
문단, 컬러, 글꼴, 목록 태그 다루기 – 글꼴 관련 태그
[<h숫자> 태그와 <font size=숫자> 태그] 비교 항목 <font size=숫자> <h숫자> 기본 값 <font size=3> <h4> 같은 결과 출력 <b>내용</b><p> <h4>내용</h4> 문단 구분 × ○ 빈 행 추가 한 문단 안에서 글자크기 다양하게 설정 가능 불가능
14
문단, 컬러, 글꼴, 목록 태그 다루기 – 목록 관련 태그
[<ul> 태그와 <ol> 태그] 비교 항목 <ul> <ol> 약어 unorderlist orderlist 용도 순서 없는 목록 순서 있는 목록 Type 속성 Dsik(●),circle (○) ,square(□) 1, A(알파벳 대문자), a(알파벳 소문자), I(로마숫자 대문자), I(로마숫자 소문자) 기본 값 disk 1 사용 예 <ul type=square> 목록 </ul> <ol type=A> 목록 </ol>
Similar presentations
