<a>태그 : HTML 태그의 제왕
- 링크달기
- 티스토리
- 누르면 그 링크로 넘어 갈 수 있도록.
<a href="https://www.tistory.com/" target="_blank" title="티스토리">티스토리</a>
- a=anchor
- 속성
- href="링크주소" 이링크로 연결해줘
- target="_blank" 새탭으로 열고싶어
- title="툴팁에 떴으면 좋겠는 문구" 누르기전에 툴팁으로 알려주고싶어
웹사이트 완성
- <a href="">
- 웹페이와 웹페이지를 연결해주는 링크를 통해 웹사이트 만들기.
- 태그 <a href="">를 사용해서 각페이지에 맞게 링크를 걸어둔다.
- 같은 템플릿 형식으로 프로젝트를 필요한 만큼 만든다.
- 같은 템플릿의 프로젝트 복사 하는 법 : 1.html 우클릭 → Duplicate 클릭 → 이름 바꿔서 저장(ex 2.html)
- 그 글자를 클릭 했을 때 그 페이지로 이동하는 웹사이트 완성.
<h1><a href="index.html">Tistory</a></h1>
<ul>
<li><a href="1.html">피드</a></li>
<li><a href="2.html">스토리</a></li>
<li><a href="3.html">스킨</a></li>
<li><a href="4.html">포럼</a></li>
</ul>
오늘의 느낀점
그동안 배운 내용이 짧아보여도 이걸 적용해서 하나의 사이트를 만들려면 생각보다 많은 시간이 걸린다. 특히 어떤 태그인지 배웠다고 해서 내가 만들 문서에서 정확히 어디에 가져다 쓸지를 알려주는 것은 아니다. 스스로 생각하고 적용하고 오류가 나거나 원래 의도와 다르게 나타나면 또 다시 생각해야 하는데 이 부분에서 시간이 많이 걸린다. 기획 단계에서 꼼꼼하게 기획하는 것이 실제로 각각의 페이지들을 만드는 시간을 단축 시킬 수 있겠다고 생각했다. 앞으로 더 많은 프로젝트를 만들텐데 기획단계부터 꼼꼼하게 해야겠다. 아직은 어색하지만 코딩을 하면서 프로그래머의 관점에서 생각하는 것을 더 연습해야지!
'프로그래밍언어 > HTML' 카테고리의 다른 글
[HTML] HTML문서에 다른 사람들이 만들어 놓은 기능 추가하기(동영상, 댓글, 채팅, 방문자분석) (0) | 2020.11.17 |
---|---|
[HTML] <meta> 태그의 속성들 (0) | 2020.11.14 |
[HTML] 부모-자식 태그와 문서구조 (0) | 2020.11.11 |
[HTML] 줄 바꿈 태그와 이미지 태그(+속성) (0) | 2020.11.08 |
[HTML] 기본 문법 태그(+검색하는 법) (0) | 2020.11.07 |