주간 베스트 월간 베스트 3개월 베스트 베스트 게시물
꽃배달 한국, 중국 전지역배송

html 제 5 강 약간 조잡한 것들 ^^*

노아 | 2002.03.10 21:43:22 댓글: 11 조회: 1782 추천: 9
분류웹 프로그래밍 https://life.moyiza.kr/itstudy/1758782
지난번 강좌에서 1 달이 지났군요...
뭐 왜서 왜서 라고 이유는 밝히지 않겠습니다.
대신 이제부턴 1~2주 한 회씩 꼭 올리도록 약속하겠습니다.
html 은 원래 어려운거 아니니까 강좌는 30 회 정도로
마무리 질까 생각입니다. 차근차근 따라하신다면
웬만한 홈페이지 같은건 손쉽게 제작할수 있을겁니다.

그리구 강좌보시구 밑에 코멘드 남겨주셨음 고맙겠습니다.
강좌에 대한 의견이랑 아님 그냥 한마디라두...
님들의 그런 한마디가 얼마나 큰 힘이 되는데요~ ^^*

그럼 오늘 강좌 시작합니다.

오늘은  html 에서 약간 조잡한(?) 태그들을 배워보겠습니다.
실제로는 크게 씌여지진 않지만 가끔 필요할때가 있을겁니다.

<hr>과 <ul> 그리고 <ol>

<hr>

hr 이 뭐하는 태그냐면요 한마디로 선입니다.
글을 쭈~욱 쓰다가 선을 긋고 싶을적에 hr 해주면 됩니다.
선도 그냥 선이 아니라 속성들이 있죠.
긴선이냐 짧은 선이냐 , 두께가 얼마냐 , 색상이 어떠냐..
그래서 hr 에는 요런 속성들이 따름니다.

width : 수평선의 길이
size : 수평선의 두께
align : 수평선의 위치(left,right,center)
color : 수평선 색상
noshade : 수평선을 평면으로 보이게 합니다.


<html>
<head>
<title>수평선태그 hr </title>
</head>
<body>
<center>
hr 태그 연습입니다.<p>
먼저 그냥 hr 만 써보겠습니다.<p>
<hr>
<p>
이번엔 width 선 길이 속성을 넣어보겠습니다.<p>
width = 180 입니다.<p>
<hr width=180>
<p>
이번엔 size 선 두께 속성을 넣어보겠습니다.<p>
size=5 입니다.<p>
<hr size=5>
<p>
호호 확실히 변했죠?<p>
이번엔 align 수평선 이 있게될 위치속성 입니다.<p>
align 속성은 width 길이속성이랑 함께 사용해야만 <br>
그 효과가 알립니다. 그잖으면 전 화면에 선이 꽉 차니까요<p>
<hr width=200 align=left><p>
<hr width=200 align=right><p>
<hr width=200 align=center><p>
선 색상 color 속성입니다.<p>
<hr color=blue><p>
푸른선이 되였죠..^^ 전에 많이 봤던 color 속성이라 괜찮겠죠.<p>
마지막으로 noshade 속성입니다. <p>
말로는 수평선을 평면으로 보이게 한다는데 <p>
눈으로 확인해 보시져.<p>
<hr noshade><p>
그냥 이러면 않알리죠..^^<p>
선 두께를 넣어서 있을때와 없을때를 비교해 봅시다.<p>
noshade 없을때<p>
<hr size=8><p>
noshade 있을때<p>
<hr size=8 noshade><p>
확실한가요? ^^<p>

예제를 보시려면 요기 를 클릭해보세요.

<ul>

ul 은 목록을 만드는 태그입니다.
그냥 앞에 동그라미 라던가 그런 기호를 붙혀주는 작용을 합니다.
type 라는 속성이 있는데 사용하지 않으면
기본으로 검은 원형기호가 나오고 circle 는 속빈원형,square는 네모칸임다.

예제 볼까요~

<html>
<head>
<title>목록만들어주는 ul 태그 </title>
</head>
<body>
<h3>모이자 메뉴 </h3>
<ul>
<li>홈페이지 공부</li>
<li>커뮤니티</li>
<li>자료실</li>
<li>추천사이트</li>
</ul>
<p>
<h3>모이자 메뉴 circle 속성</h3>
<ul type=circle>
<li>홈페이지 공부</li>
<li>커뮤니티</li>
<li>자료실</li>
<li>추천사이트</li>
</ul>
<h3>모이자 메뉴 square 속성</h3>
<ul type=square>
<li>홈페이지 공부</li>
<li>커뮤니티</li>
<li>자료실</li>
<li>추천사이트</li>
</ul>
<h3>모이자 메뉴</h3>
몇개중 하나만 바꾸고 싶을때<p>
<ul>
<li type=square>홈페이지 공부</li>
<li>커뮤니티</li>
<li type=circle>자료실</li>
<li>추천사이트</li>
</ul>
</body>
</html>

예제를 보시려면 요기 를 클릭해보세요.


<ol>

마지막 ol 입니다.
ul 이랑 비슷합니다. 이것도 목록을 만들어주는데
ul 처럼 동그라미랑 아니구 숫자거나 문자가 차례로 앞에 붙습니다.
ol 태그도 숫자가 붙냐 문자가 붙냐를 type 속성으로 설정합니다.
type 를 사용하지 않으면 자동으로 숫자가 붙습니다.
a : a,b,c... 영어가 붙습니다.
A : A,B,C... 대문자가 붙습니다.
i : 로마문자 랍니다.
I : 로마대문자 랍니다.

예제 봅시다.

<html>
<head>
<title>목록만들어주는 ol 태그 </title>
</head>
<body>
<h3>모이자 메뉴 </h3>
<ol>
<li>홈페이지 공부</li>
<li>커뮤니티</li>
<li>자료실</li>
<li>추천사이트</li>
</ol>
<p>
<h3>모이자 메뉴 10 부터 시작</h3>
<ol start=10>
<li>홈페이지 공부</li>
<li>커뮤니티</li>
<li>자료실</li>
<li>추천사이트</li>
</ol>
<p>
<h3>모이자 메뉴 </h3>
<ol type=a>
<li>홈페이지 공부</li>
<li>커뮤니티</li>
<li>자료실</li>
<li>추천사이트</li>
</ol>
<p>
<h3>모이자 메뉴 </h3>
<ol type=A>
<li>홈페이지 공부</li>
<li>커뮤니티</li>
<li>자료실</li>
<li>추천사이트</li>
</ol>
<p>
<h3>모이자 메뉴 </h3>
<ol type=i>
<li>홈페이지 공부</li>
<li>커뮤니티</li>
<li>자료실</li>
<li>추천사이트</li>
</ol>
<p>
<h3>모이자 메뉴 </h3>
<ol type=I>
<li>홈페이지 공부</li>
<li>커뮤니티</li>
<li>자료실</li>
<li>추천사이트</li>
</ol>
<p>
</body>
</html>

예제를 보시려면 요기 를 클릭해보세요.

이해가 가시나요~?
오늘 배운 태그는 사실 자주 사용는 되지는 않는겁니다.
님들이 어떻게 활용하나에 달렸겠죠..^^
담번강좌부터는 제때 제때에 올리도록 노력하겠습니다.

그럼 전 이만.
건강하세요~ ^^*

* 전설님에 의해서 게시물 이동되었습니다 (2004-05-30 17:07)
* 이동한 이유 :
* 원래의 위치 : 웹 공부 >> 웹 프로그래밍
* 이동후 위치 : 웹 공부 >>

* 전설님에 의해서 게시물 이동되었습니다 (2004-05-30 17:12)
* 이동한 이유 :
* 원래의 위치 : 웹 공부 >>
* 이동후 위치 : 웹 공부 >> 웹 프로그래밍
추천 (9) 선물 (0명)
IP: ♡.27.♡.99
rena (♡.129.♡.173) - 2002/04/07 13:36:23

수고 많으십니다. 간단명료한 강좌 잘 들었습니다.

이현주 (♡.156.♡.121) - 2002/04/11 11:12:50

넘 오래동안 글 안 올려줘서 이 사이트 안 들어왔는데 이젠 부지런히 들어와야겠네요

김진모 (♡.190.♡.62) - 2002/06/24 15:27:47

헉 갑자기 안배운 센터가 왜 나왔지 &lt;center&gt; 중앙이라는 뜻인것같은데???알려주세요..

김진모 (♡.190.♡.62) - 2002/06/24 15:35:45

별의미는 없는것 같네요.
&lt;center&gt;를 빼고 하니 좌측으로 밀리는 것 뿐이네요..ㅎㅎㅎ

김진모 (♡.190.♡.62) - 2002/06/24 16:19:58

&lt;li&gt; &lt;/li&gt; 설명도 빠진것 같네요.
제가 처음이라 몰라서 그래요...미안..
하지만 빠진것 같아서,,

황남호 (♡.27.♡.102) - 2002/06/27 20:56:26

죽인다.빠이 알린다

♥사랑♥ (♡.179.♡.252) - 2002/07/05 14:12:26

호호~ 잘 배워나가기는 하는데 꼭 앞페이지 몇번씩 뒤져봐야되네용^^
아고~하루죙일 두눈 똑바로 뜨고 배웠드만 눈알 모일라칸다용 ㅋㅋㅋ
노아님~ 이번 강좌도 잘 들었슴당~ 땡큐^^*

하늘 (♡.99.♡.43) - 2002/07/10 09:32:41

차근차근 따라하니까 다 되는구만, 이렇게 길게 쓰느라구 참 수고도 많았겠수다.감사!

chwcd (♡.197.♡.191) - 2002/10/04 20:57:36

이제야 기회있어 태그에 대하여 배우게 되였습니다.
좋은 강의에 감사요!!!!!

은주 (♡.130.♡.126) - 2003/07/26 04:24:19

땡큐~~~`
꾸벅~~~~~~~~~~~~~~~~~~`

유령 (♡.81.♡.34) - 2004/05/31 13:57:40

형 centr 이거 뭐더라? 깜빡햇는데..

3,006 개의 글이 있습니다.
제목 글쓴이 날짜 조회
관리자
2003-09-20
11846
관리자
2003-09-20
11395
관리자
2003-09-20
20525
지구인
2010-08-27
19327
지구인
2009-09-07
13648
SOLIDH
2010-01-29
15601
엔죠라이프
2004-10-07
16701
네로
2002-03-15
1618
네로
2002-03-12
1510
노아
2002-03-10
1782
네로
2002-02-25
2644
네로
2002-02-22
521
네로
2002-02-17
1841
네로
2002-02-09
666
네로
2002-02-09
2492
네로
2002-02-09
1392
D3µX
2002-02-08
382
노아
2002-02-07
2483
네로
2002-02-05
427
태성
2002-02-03
916
태성
2002-02-03
389
태성
2002-02-03
407
태성
2002-02-03
621
태성
2002-02-03
504
태성
2002-02-03
377
태성
2002-02-03
483
태성
2002-02-03
520
태성
2002-02-03
393
모이자 모바일