SpringFramework를 이용한 웹사이트 만들기(4)--메인페이지 만들기

이번 시간에는 항공 예약사이트 메인 페이지를 만들어 보도록 하겠습니다.

저는 부트스트랩을 사용할 것이기 때문에 include폴더를 만들어서 부트스트랩,w3링크 등을 붙여넣기 해줍니다.

 

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">

 

 

 

 

붙여넣은 부트스트랩을 jsp:include를 통해 head에 걸어주고 메인 틀을 잡아줍니다.

 

 

 

 

그러면 이렇게 메인 틀이 완성이됩니다.

 

 

메인 페이지에 넣을 이미지를 resources에 폴더를 만들어 넣어주세요.

그 다음 servlet에 가셔서 location설정을 해주세요 꼭 안하셔도 되는데 설정하면 편해져요!(제기준)

 

 

w3의 css기능으로 select를 넣어주고 간격 설정해주면 메인 페이지가 완성됩니다!!

 

 

완성!~!~!!

자세한 코드내용은 깃 허브를 확인해주세요.

 

 

깃 링크 - https://github.com/seongjaePark12/Air_Reservation/tree/master/Air_reservation