* 욕설, 비방, 광고, 도배질 글은 임의로 삭제됩니다.

[펌 강의] 4. 글자의 스타일 그리고 관련된 tag

페이지 정보

써니

본문

size="2">4. 글자의 스타일 그리고 관련된 tag


여기서는 글자의 스타일에 대해서 알아보겠습니다. 글자 스타일의 종류에는 크게 두 가지가 있습니다.


첫째, 글자가 사용되는 목적에 따라 개념적으로 스타일에 변화를 주는 것으로 논리적 스타일이라고도 합니다.

둘째, 화면에 나타나는 모양을 변화시키는 방법으로 물리적 스타일이라고도 하죠.


그러면 첫째 방법과 둘째 방법에 대해 어떠한 것이 있나 알아보도록 할께요.


① 논리적 스타일

 

<ABBREV>...</ABBREV>

긴 문장을 생략해서 쓸 때 사용하는 스타일

<ACRONYM>...</ACRONYM>

문장에서 약자를 나타낼 때 사용하는 스타일

<ARG>...</ARG>

줄거리나 증명 등을 나타내는 문장에 사용하는 스타일

<CITE>...</CITE>

문장의 특정 부분을 인용하고 싶을 때 사용하는
스타일

<CODE>...</CODE>

컴퓨터의 프로그램 상에서 코드를 나타낼 때
사용하는 스타일

<DFN>...</DFN>

용어에 대한 정의나 예제 등을 나타낼 때 사용하는 스타일

<EM>...</EM>

문장의 특정 부분을 강조하고 싶을 때 사용하는 스타일

<KBD>...</KBD>

컴퓨터의 키보드로 입력한 문장임을 나타낼 때 사용하는 스타일

<Q>...</Q>

짧은 인용 문장을 나타낼 때 사용하는 스타일

<SAMP>...</SAMP>

문장에서 특정 부분에 대한 예제 등을 사용하고 싶을 때 사용하는 스타일

<STRONG>...</STRONG>

강조하는 부분을 나타낼 때 사용하는 스타일

<VAR>...</VAR>

프로그램 변수 이름 등을 나타낼 때 사용하는 스타일


② 물리적 스타일
 

<B>...</B>

볼드체의 약자로 강조해서 나타내고자 할 경우 사용하는 스타일

<BIG>...</BIG>

문장에서 사용하는 다른 글자보다 큰 글자로 표현하고 싶을 때 사용하는 스타일

<BLINK>...</BLINK>

깜박이는 문자를 표현하고 싶을 때 사용하는 스타일. 넷스케이프에서만 적용이 가능하고 익스플로어에서는 무시된다.

<I>...</I>

글자를 이탤릭체로 표현하고 싶을 때 사용하는 스타일

<S>...</S>

밑줄이 아닌 글자의 중간에 줄을 그어 나타내고 싶을 때 사용하는 스타일

<SMALL>...</SMALL>

문장에서 사용하는 다른 글자보다 작은 글자로 표현하고 싶을 때 사용하는 스타일

<SUB>...</SUB>

아래첨자로 사용하고 싶을 때 사용하는 스타일

<SUP>...</SUP>

위 첨자로 사용하고 싶을 때 사용하는 스타일

<TT>...</TT>

타자기로 친 것과 같은 느낌을 주고 싶을 때 사용하는 스타일로 고정폭 글꼴 (Fixed Font Width)로 나타난다.

<U>...</U>

글자에 밑줄을 그어 나타내고 싶을 때 사용하는 스타일


그럼 간단하게 논리적 스타일과 물리적 스타일에 대해 예를 들어볼께요.


③ 논리적 스타일 예
 

<HTML>

<HEAD>
  <TITLE> 논리적 스타일
표기 </TITLE>
</HEAD>
<BODY>

  <H2>논리적 스타일 표기 예제</H2>

  <P ALIGN="center">글자가
사용되는 목적에 따라 개념적으로 스타일에 변화를 주는
것을 말합니다.</P>
  <BR><BR>

  
<ABBREV> size="2" color="gray">ABBREV(Abbreviation)
-- 생략</ABBREV> size="2" color="gray"><BR>

  <ACRONYM> size="2" color="gray">ACRONYM(Acronym)
-- 약어</ACRONYM> size="2" color="gray"><BR>

  <ARG> size="2" color="gray">ARG(Argument)
-- 논리, 이론</ARG> size="2" color="gray"><BR>

  <CITE> size="2" color="gray">CITE(Citation)
-- 부분 인용</CITE> size="2" color="gray"><BR>

  <CODE> size="2" color="gray">CODE(Code) --
코드</CODE> size="2" color="gray"><BR>

  <DFN> size="2" color="gray">DFN(Definition)
-- 정의</DFN> size="2" color="gray"><BR>

  <EM> size="2" color="gray">EM(Emphasis) --
부분 강조</EM> size="2" color="gray"><BR>

  <KBD> size="2" color="gray">KBD(Keyboard)
-- 키보드 문자 입력 color="red"></KBD> size="2" color="gray"><BR>
   size="2" color="red"><Q> size="2" color="gray">Q(short Quotation)
-- 짧은 인용구</Q> size="2" color="gray"><BR>

  <SAMP> size="2" color="gray">SAMP(Sample) --
샘플</SAMP> size="2" color="gray"><BR>

  <STRONG> size="2" color="gray">STRONG(Strong)
-- 강한 강조</STRONG> size="2" color="gray"><BR>

  <VAR> size="2" color="gray">VAR(Variable)
-- 변수</VAR> size="2" color="gray"><BR>

</BODY>
</HTML>
                          
target="_blank">결과보기


④ 물리적 스타일 예

 

<HTML>

<HEAD>
  <TITLE> 물리적 스타일
표기 </TITLE>
</HEAD>
<BODY>

  <H2>물리적 스타일 표기 예제</H2>

  <P ALIGN="center">화면에
나타나는 모양을 변화시키는 방법을 물리적 스타일이라고
합니다.</P>
  <BR><BR>

  
<B> size="2" color="gray">B(Boldface) --
볼드체</B> size="2" color="gray"><BR>

  <BIG> size="2" color="gray">BIG(Big) -- 큰
글꼴</BIG> size="2" color="gray"><BR>

  <BLINK> size="2" color="gray">BLINK(Blinking)
-- 깜빡이는 글자 color="red"></BLINK> size="2" color="gray"><BR>
   size="2" color="red"><I> size="2" color="gray">I(Italics) --
이탤릭체인용</I> size="2" color="gray"><BR>

  <S> size="2" color="gray">S(Strike) -- 중간
줄 긋기(?)</S> size="2" color="gray"><BR>

  <SMALL> size="2" color="gray">SMALL(Small) --
작은 글꼴</SMALL> size="2" color="gray"><BR>

  <SUB> size="2" color="gray">SUB(Subscript)
-- 아래 첨자</SUB> size="2" color="gray"><BR>

  <SUP> size="2" color="gray">SUP(Superscript)
-- 위 첨자</SUP> size="2" color="gray"><BR>

  <TT> size="2" color="gray">TT(Typewriter)
-- 타자기체</TT> size="2" color="gray"><BR>

  <U> size="2" color="gray">U(Underline) --
밑줄</U> size="2" color="gray"><BR>

</BODY>
</HTML>
                          
target="_blank">결과보기

작성일2005-02-14 16:13

라이브카지노님의 댓글

라이브카지노
안녕하세요. 다양한정보 감사합니다. 스포츠토토 먹튀검증 타임스포츠토토 추천드립니다.https://timespototo.com/스포츠토토 https://online-safer.com/라이브카지노 https://jusobada.com/주소모음
컴퓨터/인터넷 목록
번호 제목 글쓴이 날짜 조회
112 [펌 강의] 부록 - 홈페이지에 음악 넣기 댓글[1] 인기글 써니 2005-03-04 6951
111 [펌 강의] 색살 표 (Color Chart) 댓글[1] 인기글 써니 2005-03-04 6564
110 [펌 강의] 30.Form 예제 (설문양식) 댓글[1] 인기글 써니 2005-03-04 6662
109 정크메일 과 광고전화 막는법 아시는분 도와주세요.. 댓글[1] 인기글 정크 2005-03-02 6922
108 동영상 퍼오는방법 아시는분 ..좀 알켜주세요 댓글[4] 인기글 진실 2005-03-01 6742
107 [펌 강의] 29. 선택목록(List Box or Drop Down Li 댓글[1] 인기글 써니 2005-02-28 6989
106 [펌 강의] 28.텍스트 영역(Text Area) 인기글 써니 2005-02-28 19951
105 [펌 강의] 27.Input Type Form (II) - Check B 댓글[1] 인기글 써니 2005-02-28 8389
104 [펌 강의] 26. Input Type Form (I) - 텍스트, 암호 댓글[15] 인기글 써니 2005-02-28 18478
103 [펌 강의] 25. Form에 대한 개요 인기글 써니 2005-02-28 23015
102 윈도우가 안꺼져요ㅠㅠㅠ 댓글[1] 인기글 경아 2005-02-27 7150
101 답변글 윈도우가 안꺼져요ㅠㅠㅠ 댓글[1] 인기글 써니 2005-02-27 6903
100 써니님, brian님 너무 감사하구요 하나더 여쭤볼께요. 인기글 제키챤 2005-02-24 9019
99 답변글 써니님, brian님 너무 감사하구요 하나더 여쭤볼께요. 댓글[1] 인기글 써니 2005-02-25 6702
98 [펌 강의] 23.프레임(Frame) 나누기 예제(III) 댓글[2] 인기글 써니 2005-02-24 14923
97 [펌 강의]22. 프레임(Frame) 나누기 예제(II) 댓글[1] 인기글 써니 2005-02-24 12533
96 [펌 강의] 21. 프레임(Frame) 나누기 예제(I) 댓글[1] 인기글 써니 2005-02-24 7095
95 [펌 강의] 20. 프레임(Frame) 나누기 (II) 인기글 써니 2005-02-24 6913
94 컴이 말썽을 부릴땐 망치로 한대...... (SOS !) 댓글[1] 인기글 선달 2005-02-23 8149
93 답변글 컴이 말썽을 부릴땐 망치로 한대...... (SOS !) 댓글[1] 인기글 써니 2005-02-23 7769
92 답변글 대단 합니다 써니님...... !! 댓글[1] 인기글 선달 2005-02-24 7670
91 sim 에 문제가 있어 프로그램을 종료해야 한다는데......??? 댓글[1] 인기글 So.Cal. 2005-02-23 7168
90 [펌 강의] 19. 프레임(Frame) 나누기 (I) 댓글[1] 인기글 써니 2005-02-22 8292
89 [펌 강의] 18. 프레임(Frame) tag 댓글[1] 인기글 써니 2005-02-22 7856
88 [펌 강의] 17. 프레임(Frame)이란 무엇일까? 인기글 써니 2005-02-22 9653
87 [펌 강의] 16. Table을 이용한 이력서 만들기 인기글 써니 2005-02-22 18791
86 [펌 강의] 15. Table 예제 몇 개 댓글[1] 인기글 써니 2005-02-22 6845
85 디지탈 카메라에 대해 댓글[1] 인기글 당췌모름 2005-02-21 8254
84 포맷변환에대해 댓글[1] 인기글 막무가네 2005-02-21 7466
83 답변글 포맷변환에대해 댓글[1] 인기글 써니 2005-02-21 7785
게시물 검색
* 본 게시판의 게시물에 대하여 회사가 법적인 책임을 지지 않습니다.