본문 바로가기

Dev/[Java]

[Spring] 10. BootStrap적용

반응형

 

 

 

부트스트랩 페이지 접속

 

 

설치 방법은 3가지가 있다.

1. notejs에서 명령어 이용해서 install하는 방법

2. CDN(Conntent Delevery Network)

3. Homepage에서 Download받는 방법

 

무튼..

 

우리는 Common.jsp하나를 만들어서, 거기에 <head>를 Bootstrap을 사용가능하도록 작성한 후,

다른 jsp에서 이걸 참조하도록 할것이다.

 

1. common.jsp생성

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<head>
<meta charset="UTF-8">
<title>사용자 관리</title>
<!-- CSS only -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-giJF6kkoqNQ00vy+HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1" crossorigin="anonymous">
<!-- JavaScript Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/js/bootstrap.bundle.min.js" integrity="sha384-ygbV9kiqUc6oa4msXn9868pTtWMgiQaeYH7/t7LECLbyPA2x65Kgf80OJFdroafW" crossorigin="anonymous"></script>
</head>

 

2. index.jsp에 적용해본다.

적용방법은2가지이다.

 

<%@ include file = "" %>
<jsp:include page=""/>

 

이 두개의 차이는

<%@ include file = "" %> 얘는 index.jsp

index.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ page import="java.util.Date"%>
<!DOCTYPE html>
<html>
<%--
<%@ include file = "common.jsp" %> 
--%>

<jsp:include page="common.jsp"/>


<body>
	<h1>사용자 관리</h1>
	<%--
	Date date = new Date(); 
	out.println("스트림으로 출력한 현재 시간은 : " + date);
	--%>
	<ul>
		<li><a href="userList.do">1.사용자 리스트</a></li>

		<!-- 여기선 form을 뿌려준다.. -->
		<li><a href="userInsert.do">2.사용자 등록</a></li>
		
		<li><a href="userDetail.do">3. test</a></li>
	</ul>

</body>
</html>

www.w3schools.com/bootstrap4/bootstrap_forms.asp

 

Bootstrap 4 Forms

Bootstrap 4 Forms Bootstrap 4's Default Settings Form controls automatically receive some global styling with Bootstrap: All textual , , and elements with class .form-control have a width of 100%. Bootstrap 4 Form Layouts Bootstrap provides two types of fo

www.w3schools.com

여기서 적용시키고 싶은 것 적용..

 

반응형

'Dev > [Java]' 카테고리의 다른 글

[Spring] Restful 적용, AJAX 써보기, Jquery  (1) 2021.02.03
[Spring] 쿼리스트링을 URL 형식으로 보내기  (0) 2021.02.03
war로 배포하는 법  (0) 2021.02.03
[Spring] 9. Spring MVC 직접해보기  (0) 2021.02.02
[Spring] 8. Spring MVC  (0) 2021.02.02