2022-07-19 HTML_7

2022. 7. 20. 14:37FE/HTML

https://opentutorials.org/course/3084/18418

 

HTML 태그의 제왕 - 생활코딩

우리는 지금까지 문서를 만드는 방법을 충분히 자세히 살펴봤습니다. 태그를 결합하는 방법을 완전히 마스터했고, 빈도수가 절대적으로 높은 태그들을 살펴봤습니다. 앞으로 배울 것 보다, 지

opentutorials.org

이 글은 이고잉님의 오픈튜토리얼 강의를 듣고 정리한 내용입니다.


a tag

 

지금의 웹을 만든 중요한 태그가 있다.

 

웹과 웹이 서로 연결하는 <a> 태그가 그것이다.

 

<a href="이동할 웹 주소">text</a>

href : Hypertext + reference

 

자주 쓰는 형식은….

 

<a href="www..." target="_blank" title="description">text</a> 
  • target=”_blank” : 새 탭으로 열기
  • title=”…” : 커서가 위에 있을 때 표시되는 정보

 

출처를 표시하기 위해서 나무위키로 링크를 만들어보자.

<p>출처 : <a href="https://namu.wiki/w/%ED%99%8D%EC%B0%A8" target="_blank" title="나무위키_홍차">나무위키 홍차</a></p>

 


웹 페이지 완성하기

 

강의에서는 위와 같이 링크를 연결한다.

 

나는 참고해서 링크를 구성하자.

 

<body>
    <h1><a href="index.html">차</a></h1>
    <ul>
      <li><a href="1.html" target="_blank">홍차</a></li>
      <li><a href="2.html" target="_blank">우롱차</a></li>
      <li><a href="3.html" target="_blank">녹차</a></li>
    </ul>

    <h2>홍차</h2>
...

 

이제 index.html, 2.html, 3.html를 만들어 준다.

 

web.zip
6.27MB

 

 


'FE > HTML' 카테고리의 다른 글

2022-07-27 HTML_9  (0) 2022.07.27
2022-07-23 HTML_8  (0) 2022.07.27
2022-07-18 HTML_6  (0) 2022.07.18
2022-07-16 HTML_5  (0) 2022.07.17
2022-03-04 HTML_4  (0) 2022.03.04