<![CDATA[
<xhtml>
<head>
<title>HTML </title>
<xscript language="JavaScript">
<!-- function na_open_window(name, url, left, top, width, height, toolbar, menubar, statusbar, scrollbar, resizable) { toolbar_str = toolbar ? 'yes' : 'no'; menubar_str = menubar ? 'yes' : 'no'; statusbar_str = statusbar ? 'yes' : 'no'; scrollbar_str = scrollbar ? 'yes' : 'no'; resizable_str = resizable ? 'yes' : 'no'; /*window.open*/(url, name, 'left='+left+',top='+top+',width='+width+',height='+height+',toolbar='+toolbar_str+',menubar='+menubar_str+',status='+statusbar_str+',scrollbars='+scrollbar_str+',resizable='+resizable_str); } // -->
</xscript>
</head>
<xbody bgcolor="white" text="black" link="blue" vlink="purple" alink="red">
<TABLE border=0 width="600" align="center" cellpadding="10" cellspacing="10" bgcolor="#B2B6E2">
<TBODY>
<TR>
<TD width=596>
<TABLE border=1 borderColorDark=white borderColorLight="white" cellSpacing=0 width="600" bordercolor="white">
<TBODY>
<TR>
<TD align=middle bgColor=#eee1f3 width=145>
<P><FONT color=purple>HTML </FONT></P></TD>
<TD width=299>
<P><font size="2"> </font></P></TD>
<TD bgColor=#eee1f3 width=142>
<P> </P></TD></TR></TBODY></TABLE></TD></TR>
<TR>
<TD align=left width=739 bgcolor="#D0D7F6">
<P><FONT color=#065176 face=돋움><B><BR></B></FONT><FONT color="blue"><span style="font-size:11pt;">▒
</span><B><span style="font-size:11pt;">글꼴 사용</span></B></FONT></P>
<TABLE border=0>
<TBODY>
<TR>
<TD bgColor=#f7ecec width=590>
<UL>
<LI style="MARGIN-TOP: 5mm"><FONT color=purple><span style="font-size:11pt;">다양한 글꼴의 사용법을 이해한다.</span></FONT>
<LI><FONT color=purple><span style="font-size:11pt;">글자의 크기,색깔,서체 등을 지정하는 방법을 익힌다.</span></FONT>
<LI style="MARGIN-TOP: 1px"><FONT color=purple><span style="font-size:11pt;">색깔이름, 16진수 RGB 코드를 살펴보고,
직접 사용해 본다. </span></FONT>
</LI></UL></TD></TR></TBODY></TABLE>
<P style="LINE-HEIGHT: 130%"><FONT style="FONT-FAMILY: 굴림,arial,curier; FONT-SIZE: 9pt"><span style="font-size:11pt;"> </span></FONT><FONT color="#6666FF" style="FONT-FAMILY: 굴림,arial,curier; FONT-SIZE: 9pt"><B><span style="font-size:11pt;">글꼴
지정하기</span></B></FONT><FONT color=#f05a5a style="FONT-FAMILY: 굴림,arial,curier; FONT-SIZE: 9pt"><B><span style="font-size:11pt;"><BR></span></B></FONT><FONT style="FONT-FAMILY: 굴림,arial,curier; FONT-SIZE: 9pt"><B><span style="font-size:11pt;"><BR></span></B></FONT>
<TABLE border=1 borderColor=silver cellPadding=3 cellSpacing=0 width=500>
<TBODY>
<TR>
<TD bgcolor="#F7ECEC"><FONT color=purple><B><span style="font-size:11pt;"><FONT> </span></B><span style="font-size:11pt;">태그<BR> - 기능 : 글자의 크기, 색깔, 서체를
지정<BR> - 속성 : size="n", color="#색상코드", face="글꼴체"
</span></FONT></TD></TR></TBODY></TABLE>
<P style="LINE-HEIGHT: 130%"><FONT style="FONT-FAMILY: 굴림,arial,curier; FONT-SIZE: 9pt" color="#666666"><span style="font-size:11pt;">글자의 크기지정과 대표적인 몇가지 글꼴을 사용해
볼까요? <BR>메모장에서 아래와 같이 입력해 보세요.</span></FONT><font color="#666666"><span style="font-size:11pt;"><BR></span></font><FONT color=gray><span style="font-size:11pt;"><br> </span></FONT>
<TABLE bgColor=#fffeca border=0 width=500 align="center">
<TBODY>
<TR>
<TD>
<P><span style="font-size:11pt;"><HTML><BR><HEAD><BR><TITLE> 글자크기와 글꼴지정하기
</TITLE><BR></HEAD><BR><BODY><BR> <FONT
SIZE=-2 FACE=바탕>안녕하세요</FONT><BR><BR> <FONT SIZE=2
FACE=바탕>안녕하세요</FONT><BR><BR> <FONT SIZE=3
FACE=돋움>안녕하세요</FONT><BR><BR> <FONT SIZE=5
FACE=굴림>안녕하세요</FONT><BR><BR> <FONT SIZE=10
FACE=궁서>안녕하세요</FONT><BR></BODY><BR></HTML><BR></span></P></TD></TR></TBODY></TABLE>
<P style="LINE-HEIGHT: 130%" align="left"><FONT color=gray style="FONT-FAMILY: 굴림,arial,curier; FONT-SIZE: 9pt"><span style="font-size:11pt;"><BR></span></FONT><FONT style="FONT-FAMILY: 굴림,arial,curier; FONT-SIZE: 9pt"><span style="font-size:11pt;"> </span></FONT><FONT style="FONT-FAMILY: 굴림,arial,curier; FONT-SIZE: 9pt" color="#666666"><span style="font-size:11pt;">FONT 는 SIZE=3 이 기본적입니다.
폰트 싸이즈를 지정하지 않은면 3 이 된다는 것이지요.<BR>참고로 보통 웹문서에서 가장 무난하면서 많이 쓰는 size는 2
입니다.</span></FONT><FONT color="#666666" style="FONT-FAMILY: 굴림,arial,curier; FONT-SIZE: 9pt"><span style="font-size:11pt;"><BR></span></FONT><FONT color=gray style="FONT-FAMILY: 굴림,arial,curier; FONT-SIZE: 9pt"><span style="font-size:11pt;"><BR> </span><B><span style="font-size:11pt;"> </span></B></FONT><FONT color="#6666FF" style="FONT-FAMILY: 굴림,arial,curier; FONT-SIZE: 9pt"><B><span style="font-size:11pt;">글자
색깔 지정하기</span></B></FONT><FONT color=gray style="FONT-FAMILY: 굴림,arial,curier; FONT-SIZE: 9pt"><B><span style="font-size:11pt;"><BR><BR></span></B></FONT><FONT style="FONT-FAMILY: 굴림,arial,curier; FONT-SIZE: 9pt" color="#666666"><span style="font-size:11pt;">이제 글자의 색깔을 여러 가지로
지정해 볼까요?<BR>이것은 SIZE와 마찬가지로 FONT 태그 안에 COLOR를 쓰면 되지요.<BR>색깔을 지정하지 않으면 디폴트로 검정색이
설정됩니다. <br>색깔이름을 바로 써주어도 되지만, 많은 색깔의 이름을 모두 알 수 없는데다 <br>색깔을 전부 지원하지 않으므로 16진수 RGB코드를
사용합니다. <BR><BR>예를 들어 <FONT COLOR="RED">와 <FONT COLOR="#FF0000">은 동일한
색깔입니다.<br></span></FONT><FONT style="FONT-FAMILY: 굴림,arial,curier; FONT-SIZE: 9pt"><span style="font-size:11pt;"><BR>
</span></FONT><a href="xxxxxxxxxxxxjavascript:na_open_window('win', 'color1.htm', 0, 0, 400, 300, 0, 0, 0, 1, 0)"><img src="images/snote4_htm_smartbutton1.gif" namo_npi=":EmbededNPI1" border="0"></a>
<a href="xxxxxxxxxxxxjavascript:na_open_window('win', 'color2.htm', 0, 0, 400, 200, 0, 0, 0, 1, 0)"><img src="images/snote4_htm_smartbutton2.gif" namo_npi=":EmbededNPI2" border="0"></a><FONT color=gray><span style="font-size:11pt;"><BR><BR></span></FONT>
<TABLE bgColor=#fffeca border=0 width=500 align="center">
<TBODY>
<TR>
<TD>
<P><span style="font-size:11pt;"><HTML><BR><HEAD><BR><TITLE> 글자색깔 지정하기
</TITLE><BR></HEAD><BR><BODY> <BR><FONT SIZE=-2
COLOR=RED>안녕하세요</FONT><BR><BR><FONT SIZE=2
COLOR=BLUE>안녕하세요</FONT><BR><BR><FONT SIZE=3
COLOR=#002F00>안녕하세요</FONT><BR><BR><FONT SIZE=5
COLOR=#000000>안녕하세요</FONT><BR><BR><FONT SIZE=10
COLOR=#800080>안녕하세요</FONT><BR></BODY><BR></HTML><BR></span></P></TD></TR></TBODY></TABLE>
<P style="LINE-HEIGHT: 130%"><FONT color=gray><span style="font-size:11pt;"><BR></span></FONT><FONT color="#6666FF"><B><span style="font-size:11pt;"> 글자 강조하기</span></B></FONT><FONT color=gray><B><span style="font-size:11pt;"><BR></span></B></FONT><span style="font-size:11pt;"><BR></span><FONT style="FONT-FAMILY: 굴림,arial,curier; FONT-SIZE: 9pt" color="#666666"><span style="font-size:11pt;">이제 글씨를 진하게 해볼까요? <BR>FONT
태그 안에 </span></FONT><B><span style="font-size:11pt;"><font color="#666666"><B></B></font></span></B><span style="font-size:11pt;"><font color="#666666">라는 태그를
삽입하세요.</font><BR><BR></span>
<TABLE bgColor=#fffeca border=0 width=500 align="center">
<TBODY>
<TR>
<TD>
<P><span style="font-size:11pt;"><HTML><BR><HEAD><BR><TITLE> 글자 강조하기
</TITLE><BR></HEAD><BR><BODY> <BR><FONT SIZE=2
COLOR=RED>안녕하세요</FONT><BR><BR><FONT SIZE=2
COLOR=RED><B>안녕하세요</B></FONT><BR><BR><FONT SIZE=3
COLOR=BLUE>안녕하세요</FONT><BR><BR><FONT SIZE=3
COLOR=BLUE><B>안녕하세요</B></FONT><BR><BR><FONT SIZE=5
COLOR=#800080>안녕하세요</FONT><BR></BODY><BR></HTML></span></P></TD></TR></TBODY></TABLE>
<P><span style="font-size:11pt;"><font color="#666666">지정된 글자들은 굵게 진하게 나타 납니다.</font></span>
<P><FONT style="FONT-FAMILY: 굴림,arial,curier; FONT-SIZE: 9pt" color="#666666"><span style="font-size:11pt;">폰트 색깔, 서체,
싸이즈, 진하게, 밑줄, 이탤릭체 지정을 동시에 해 볼까요</span></FONT><FONT color="#666666" style="FONT-FAMILY: 굴림,arial,curier; FONT-SIZE: 9pt"><span style="font-size:11pt;">?</span></FONT><FONT color=gray><span style="font-size:11pt;"><BR><BR></span></FONT></P>
<TABLE bgColor=#fffeca border=0 width=504 align="center">
<TBODY>
<TR>
<TD>
<P><span style="font-size:11pt;"><HTML><BR><HEAD><BR><TITLE> 글자 속성 동시 지정하기
</TITLE><BR></HEAD><BR><BODY ><BR> <FONT COLOR=BLUE
FACE="궁서체" SIZE= 4><BR> <B><U><I>태그의
순서</I></U></B><BR> </FONT>
<BR></BODY><BR></HTML></span></P></TD></TR></TBODY></TABLE>
<P style="LINE-HEIGHT: 130%"><span style="font-size:11pt;"><font color="#666666">위와 같이 글자속성을 복합하여 사용할 수가 있습니다만, <br>복합 태그를
사용할 때는 지켜야 할 사항이 있습니다. <BR>시작 태그는 시작태그끼리 앞에 있어야 하고 끝 태그는 끝 태그끼리 뒤에 있어야 합니다. <br>글자를
사이에 두고 앞의 시작 태그와 뒤의 끝 태그는 항상 가운데를 중심으로 <br>쌍으로 일치되게 있어야 한다는 뜻 이지요.<BR>무슨 말이냐구요?
<BR>예를 들어 <B><U><I>
</B></U></I>가 아니라 <br>위와 같이 <B><U><I>
</I></U></B>와 같은 순서로 나열을 해야한다는 것 이지요.<BR></font><BR></span><FONT color=gray><span style="font-size:11pt;"><BR> </span><B><span style="font-size:11pt;"> </span></B></FONT><FONT color="#6666FF"><B><span style="font-size:11pt;">줄 바꾸기</span></B></FONT><FONT color=gray><B><span style="font-size:11pt;"><BR><br></span></B></FONT><span style="font-size:11pt;"><font color="#666666"><BR>이란 태그는
우리가 아래한글 워드 문서 작성시 줄 바꿀 때 Enter키를 치지요. <br>그러나 웹 문서에서는 줄 바꿀 끝 위치에 <BR>태그를 삽입해야 합니다. <BR>줄을 바꿀려고
아무리 Enter키를 쳐봐야 소용이 없다는 얘기지요. <br><BR>태그가 바로 Enter를 누른 것과 같은 효과를 나타낸다는 뜻
입니다.<BR><BR>그리고 문단을 구분해 줄때는 <P>를 씁니다. <br>이때 문단 사이에는 한 줄의 여백이
생깁니다.<BR></font></span></P>
<TABLE bgColor=#fffeca border=0 width=504 align="center">
<TBODY>
<TR>
<TD>
<P><span style="font-size:11pt;"><HTML><BR><HEAD><BR><TITLE> 줄 바꾸기
</TITLE><BR></HEAD><BR><BODY ><BR> 그냥 줄을
바꾸면<BR> 이렇게 서로 붙어 버리지요.<P><BR> BR 태그를
사용하면<BR><BR> 이렇게 다음 줄에 글이 나타납니다.<P><BR> 그리고 P 태그를 사용하면
<P><BR> 이렇게 다음 다음 줄에 글이
나타납니다.<BR></BODY><BR></HTML></span></P></TD></TR></TBODY></TABLE>
</TD></TR></TBODY></TABLE>
</xbody>
<!--Namo WebEditor Data 4.0 :EmbededNPI1 5hAAAHhe7VdvSFNRFD/bNCuNVsQUQ3uBFFFBkYTRhyQMDVKiRhiJsue252h/bD7sCQX7INGn WEMQ0fUpsBAp+2s0chKFgR/MivogRH0ISkEpKT8Y65x739ycs+kcotEd593z7rnn3HPvOef3 7iSnbAIAzRc9PrFVmBwu4bhTtrhNtbKt0cJHI+1NxjrIgM2QDYdiRUm9p6OWYHWad2EfJF60 Sx7svxIv1zXsxAk2Ded3I+9dE+GfZgI4XEXOsD5AMUqJvqG2iCQj5UAoFFInqsY1qFboFNyS 2Y0TruSWjlZ/er+pvRP6d6R/HBkICjDVfenxloe9L3qHF78rLWhBR2q4bggZM7QdGAwxR9UN VYAL3OAAE9gXbz4FGnz3TZIPbWmXbO8E7qMJLLgjAfYlYQ2jy+MhK7IB3WFnt6RmRG8UDL4A +5OzY76OelZ0zOE66BTsNuthfCc/ZzUMb8GkVTTrbkLVO722vbS4Jjcb4PKQSazSaJjqebnh WDxVHLsQY43MsLzV8IXwmcbXd1iV+PugiTFeMYWL5oZ8VRSewqcxqey0ttJLT6D33vMAHhXW iOCFsW1eeNYiiROsXAC+6zSKvUMSCRjC8j3bvVDZI1FpqW3iSLwTTsPBepxb/tMiytgrSFsx rmFnKcS9Wfi4o2pnooQcoX3qMQNeBfuDVW9ZVtTJ9T9QuvSsOA11mKn1uE5yeQosK16Hj1HN Cm0sfKDczHeF8IRFwXveEmcFgA+KWvyQVcM3XIiYV4I0qWYFGUkyK+yNokDqWip5sj6AtJej I4wi1ar+GgA2cH/JewOmYYShUUM4jkzER1QmKh9nRlR1JiKDlNczjOd3CDwMJvlaYZgkrD+F MGnHnwsaGbwsd1u5MJm7ymByBEMXtygWVhBlrX6YPscLomQtgBEpXBCpgUkqiQiazoLJQHff eHA6cL8cGIwRRcMk+TR1zc+IPNTfMmkfPfnVN5LvBd04KB8+axW6CFA5VE9aRJp3Ev1X62AO TB5FWTRM5hBMqmfHJFY6BFoI0qE5EBgW4MHd2y9XA1TO+YB6vaF5sgIcCTIjLw9RyweVbX4Y O8szo2A9HhRSKqGSArUaoLIMbCDh982u9nTxXc72HyoTnPaCb5Qwf1EkulFSQSgdfhg8wwtC xq94M1JqofIvN8pFQCX97xvqTAyVHvUmEu9G6UBZNFQq/zBUdnX1JwuVLBd8cPWGHwJGnhnG jQAtSKmESoroSoXKP5zH1fH= -->
<!--Namo WebEditor Data 4.0 :EmbededNPI2 5hAAAHhe7VfdSxRRFP/NqqlpZBAShTaBlFFBkUTQQxIGBSlRQj1ItOt+uLQfooON4MM++AdM u0FEvfjSl1maVkZLrkRh4IsW1IMUSAR9gFJhPijbOTN33F2/3RXR6Cxn7p0599x77vn43bsu n2IFIH3JoydRhdXrl0/6FEedtVpxNziMrzF6m5mNbEgoQvF0UVLvGaQlO3323dRGuG/zuALU fuW+UlO/iwa4JaO/h/raulj/eQ7g9R/2mfpAKUmZv5G2jVgh3oJoNCoGisklUivxyXUuex0N SP84MHZu+P2mG7fRuzPj01BfRMZ4W9PTzY+7X3UPLn1XFliQxmq0bpQ6dlzvR1Q3VGyoAn7U wQsrPEuffhk0jN03uoI0lyXl+U7RPhrhoB3J2J/EbBRdIx6KquSTObrvUqJKskal4Ms4kNw8 9iuk5yTDvP5DPtnjdh6hd7YzgfS8Mmn0qNETrSTpqpeU+uOzqc5pFqlLxkL0TDfW9zrV2ffB A6dZpStcttcXCpE5xBimSxWf8xq/dIS7H70Mk6uoRmQNP7ZreHHVZRsV2/qZJqmemy4bA4Mp 37tDw/kOF5fWLGS6gA0Hamls+ZjDplCrEm+juJrGcojTc+nxUEyTQxI2hPeZRxnwJtIbqXqn Z0WNUvuLpKlnxVnUUKbW0jrJ5Sn0rBgw3SiywjIdPmKOIXiiogC4NWgxWRHEnckWVIm6LCHM KyO2i6zQw5pcVngabDKrW3hqdmcf8T4DHfGduFrYmw9pg2EvW5/P0Zzq8FeSG2JdlNCJy0ch 0pOB1XWR0Zn6ko7AZBQBHSaNJUyYZKw/QzDpoZ8fDTq8rDStXpjcusZgcigWusSiWFxB9D8I IZeOdaayLKCSWF1WmOSSiKFpAkyG23pGIhPhznJaU0BZPEyyTU23QqgZb8HnAg33yc6uTGCo UEPaCNQPwxaVLwJcDhd+O2w89jTZL+pgBkweI1k8TGYxTNpN/5HEyU4gzkMGmsPhQRld7Xdf rwWonHGAapp5gE7PCngXyIyCAlINYqg9hAlxNBStJ0cRm5mhhzRFqORAzQ+VWBVQeQJuuOh8 84iWL74rSf+hcgFvL/5GOXdRLHyjDGKiMwQTbRVKzWbi5YXKeW6Ui4RKhkD+31d6rx1Pnv3p mQ8qA6K8ZrtRekkWD5W5/zBUtrb2igxbMlTqekGEhw9aLopbZeVG4Cpx8TLeKjmiqxUq/wJ9 BcYL -->
</xhtml>
<!-- -->
]]>
카페 게시글
공부방 자료
글꼴 색상 글자크기
다음검색
첫댓글 등록된 댓글이 없습니다. 댓글을 등록해 주세요.
선생님감사합니다열심히공부하곘습니다
갖여가서 열심히 사용하겠읍니다.
공부열심히 하겠습니다.
은구슬 님 감사합니다 열심히 잘 쓰겠습니다
감사합니다
잘사용하겠습니다.
원본을가저가서 잘활용하겠읍니다
가져가서 열심히 잘 활용하겠습니다
가저다 열심히 활용 하겠습니다.
잘활용할게요
고맙습니다 가져가서 잘 사용하겠습니다
가져가서 잘보겠습니다.
열심히 하겠습니다
앞으로 잘하겠습니다.
큰일났네 읽어봐도 무슨말인지 이해가 안가니
복사해서 소스만 적용하는것입니다. 쉽게 사용하시라고...