· FRONT-END/└ HTML
[ HTML ] <A> 태그
감자도리22
2024. 2. 24. 13:57
환경 : Spring Tools Suite4
[ A(Anchor) 태그 ]
- 다른 URL과 연결할 수 있는 하이퍼링크를 생성하는 태그
href 속성으로 이동할 위치를 설정 - └ (Hypertext Reference)
- title 속성으로 Tooltip 텍스트를 설정할 수 있음
- 영역에 링크를 설정하면 안됨
└ 실체가 있는 대상(글자, 이미지, 버튼, ...)에 설정하여 이동하도록 구현
[ 사용 예 ]
- HtmlController.java
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
@Controller
public class HtmlController {
@RequestMapping("/link")
public String link() {
return "/WEB-INF/views/link.jsp";
}
}
- link.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<h1>하이퍼링크 예제</h1>
<a href="https://www.naver.com">네이버로 이동</a>
<a href="https://www.google.co.kr">구글로 이동</a>
<h2><a href="https://www.melon.com/">Melon</a></h2>
<br>
<%-- (Q) 네이버 이미지 넣기 --%>
<a href="https://www.naver.com" title="네이버">
<img width="100" height="100" alt="네이버로 이동" src="/logo/naver.jpg">
</a>
<!-- 상대 주소 -->
<h2><a href="home">첫 번째 예제 보기</a></h2>
<!-- 절대 주소 -->
<h2><a href="/home">첫 번째 예제 보기</a></h2>
<h2><a href="dummy">더미이미지 예제 보기</a></h2>
<h2><a href="/dummy">더미이미지 예제 보기</a></h2>
- 출력 결과
개인 공부 기록용입니다:)
728x90