240129 게시판만들기(관리자페이지-menu,게시글 관리)
2024. 1. 29. 18:01ㆍ카테고리 없음
메뉴 jsp만들기
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<div class="menu">
<nav>
<ul>
<li onclick="url('./members')"><i class="xi-users"></i> 회원 관리</li>
<li onclick="url('./board')"><i class="xi-document"></i> 게시글 관리</li>
<li onclick="url('./comments')"><i class="xi-forum-o"></i> 댓글 관리</li>
<li onclick="url('./info')"><i class="xi-lock-o"></i> MASK님</li>
<li onclick="url('./index')"><i class="xi-paper-o"></i>게시판 </li>
<li></li>
<li></li>
</ul>
</nav>
</div>
</body>
</html>
admin, members .jsp에 만들어주기
<!-- menu 2024.01.29 메뉴jsp 만들고 연결-->
<%@ include file= "menu.jsp" %>
admin.css 수정
.menu{
width: 50px;
height: 100vh;
background-color: #373616;
color : #E9E6E1;
overflow: hidden;
}
.menu:hover{
width: 150px;
transition: 0.3s;
}
.main{
width: calc(100% - 50px);
height: 100vh;
background-color: #BE7D1F;
color : #E9E6E1;
}
css 변수 만들기
root 안에 반복되는 색, 크기 지정하고 변수로 쓰면 된다.
/*css변수 만들기 2024-01-29
--변수명 : 값;
전역 변수로 만들기 : root{}*/
root{
--main : 45px;
}
body{
margin: 0;
padding: 0;
}
.wrap{
width: 100%;
height: 100vh;
display: flex;
background-color: #E3BAB3;
}
.menu{
/*변수 사용 ver(변수명) */
width: var(--manin);
height: 100vh;
background-color: #373616;
color : #E9E6E1;
overflow: hidden;
}
웹브라우저마다 다르게 보이는 css 설정해주기
/*2024.01.29 웹브라우저마다 설정해주기*/
nav > ul > li > i{
margin-right: 5px;
/*firefox*/
-moz-margin-right:6px;
/*opera*/
-o-margin-right:6px;
/*크롬, 엣지, 웨일*/
-webkit-margin-right:6px;
}
*게시글 관리*
보드 서블릿 통과, 게시글 모든(삭제된것도)글 불러오기
-못했음