오늘은 리스트 태그와 링크태그에 대해서 포스팅합니다.
우리가 웹사이트를 돌아다니면서 메뉴등을 보게 되는데요. 그러한 메뉴들은
대부분 리스트 태그로 만들어 져있습니다.
리스트 태그는 번호가 없는 형태가 있고, 번호가 있는 형태가 있습니다. 번호가 없는 경우는 아래의 <ul>로 시작합니다.
<ul>
<li>내용1</li>
<li>내용1</li>
<li>내용1</li>
</ul>
번호가 있는 경우면은 <ol>로 시작합니다.
<ol>
<li>내용1</li>
<li>내용1</li>
<li>내용1</li>
</ol>
<li></li> 는 목록의 시작과 끝입니다.
<li>네이버</li> 이렇게 하면 메뉴는 네이버 하나만 나오구요
<li>네이버</li>
<li>다음</li>
이렇게 하면 메뉴는 목록은 네이버 와 다음 2개가 뜹니다 이런식으로 자신의 원하는 목록을 만들어 나가면 됩니다.
그럼 소스를 쳐보면서 실습을 해봅시다.
이번에는 하이퍼링크에 대해서 배워 봅시다.
하이퍼링크는 우리가 네이버등에서 뉴스를 클릭했을때 어딘가로 이동을 하죠,, 바로 그 기능인데요.
href 주소지정에 파일의 경로를 지정시 그 파일을 다운로드도 합니다.
href="app.exe" 와같이
지금 해봅시다. ㅋ
하이퍼 링크 태그는 이것 입니다.
<a href="주소">링크를 거는 콘테츠 내용, 텍스트, 이미지등 </a>
그럼 우리는 위의 리스트 위에서 실습한 리스트 소스로 테스트를 해보도록 합시다. ^^
<li></li>태그 안에다가 하이퍼링크 태그를 넣을 거에요.!!
<html>
<head>
<title>하이퍼링크를 학습해보자.</title>
</head>
<body>
<h2>하이퍼 링크</h2><br />
<ul>
<li><a href="http://www.naver.com">네이버</a></li>
<li><a href="http://www.daum.net">다음</a></li>
<li><a href="http://www.nate.com">네이트</a></li>
</ul>
</body>
</html>
그럼 이번강좌는 여기까지 하고 다음강죄에서 뵙어요
'홈페이지제작 > HTML' 카테고리의 다른 글
| [html] 홈페이지에 이미지올리는 img태그 (0) | 2017.09.02 |
|---|---|
| HTML 기본 구조 (0) | 2017.09.01 |
| [HTML 강좌] iframe 태그학습 구조<iframe> </iframe> (0) | 2017.08.31 |
| html 강좌 div 태그에 대한 학습 홈페이지 레이아웃 (0) | 2017.08.31 |
| [HTML] HTLM5 태그 정리 (0) | 2017.07.25 |
itworldkorea
IT korea가 세상(world)을 변화시킨다.