1. css에서의 display 종류와 속성에 대하여 설명하시오.
· none: 출력에 보이지 않으며, 영역도 차지하지 않는다.
· block: 기본적으로 가로 영역을 모두 차지하며, 전/후 태그에 대해서는 자동 개 행이 실행된다.
width, height, margin, padding과 같은 속성 지정이 가능하다. ex) <div>, <p>, <h>, <li> 등
· inline: block과 반대로 개 행이 일어나지 않으며 한 줄에 다른 태그들과 나란히 배치가 된다.
width, height과 같은 속성 지정이 불가능하다. ex) <span>, <b>, <i>, <a> 등
· inline-block: block과 inline의 중간 형태로, 개 행은 일어나지 않지만 width, height 등의 속성 지정이 가능하다.
2. inline-block 태그의 종류는?
· inline-block 태그의 종류로는 <img>, <button>, <select>, <input>, <audio>, <video> 등이 사용된다.
3. 문자 선택자에서 px과 eml의 차이는?
· px는 pixel을 뜻하며, 모니터(화면)에 따라서 상대적인 크기를 가지고, 크기 조정이 불가능하다.
· em은 font_size를 뜻하며, 웹 문서에서 사용되는 단위로, 크기 조정이 가능하다.
· 폰트 사이즈의 평균적인 기본값은 12pt, 16px, 1em, 100%이다.
4. opacity 속성의 사용법은?
· 투명도를 조절하는 속성으로 선택자{ opacity : 속성값; } 형태로 사용한다.
· 속성값의 기본값은 1.0으로, 0.0~1.0까지의 수 대입이 가능하며 숫자가 커질수록 불투명해진다.
5. display:none 과 visibility:hidden 의 차이는?
· display: none은 아예 사라지게 하는 속성으로 출력도 되지 않고, 영역도 차지하지 않는 속성이다.
· visibility: hidden은 보이지만 않고 자신의 영역만 차지하는 속성으로, 주어진 공간만큼만 차지한다.
6. 동적 문서와 정적 문서의 차이는?
· 동적문서는 프로그래밍 요소가 들어가며, 상황, 시간, 요청 등에 의해 새로운 내용을 표시하는 웹문서이다.
ex) JSP/Servlet, ASP, PHP
· 정적문서는 서버에 저장된 그대로 전달되는 웹문서로 동일한 값을 표시한다. ex) HTML, CSS
(JavaScript는 동적/정적 모두 사용)
7. 아래를(JSP 태그) 설명하시오.
· JSP 태그는 HTML 구간에 Java 코드를 사용하기 위해 사용되는 태그로써, 아래와 같은 의미로 사용된다.
1) 지시자: 페이지 속성을 지정 <%@ %>
2) 주석: 주석 처리 <%-- --%>
3) 선언: 변수 및 메소드 선언 <%! %>
4) 표현식: 변수 또는 메소드 결과값 출력(out과 동일한 의미) <%= %>
5) 스크립트릿: Java 코드 삽입(기본 자바 언어를 동일하게 사용 가능) <% %>
6) 액션태그: 페이지 삽입, 공유, 자바빈 사용 <jsp:action> </jsp:action>
※연습문제※
♣Servlet으로 구구단을 출력하시오♣
<구현 화면>
<gugudan.java>
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
|
@WebServlet("/gugudan")
public class gugudan extends HttpServlet {
private static final long serialVersionUID = 1L;
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
response.setContentType("text/html; charset=EUC-KR");
response.setCharacterEncoding("EUC-KR");
PrintWriter writer = response.getWriter();
writer.println("<html><head></head><body>");
writer.println("<h2>구구단 출력<h2>");
writer.println("<table border = 1>");
for(int i = 2; i <= 9; i++) {
writer.println("<tr>");
for(int j = 1; j <= 9; j++) {
writer.println("<td>");
writer.println(i + " * " + j + " = " + (i * j));
writer.println("</td>");
}
writer.println("</tr>");
}
writer.println("</table></body><html>");
}
}
|
cs |
♣JSP 태그를 이용하여 구구단을 가로로 나타내도록 출력하시오♣
<구현 화면>
<gugudan.jsp>
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
|
<body>
<table border="1">
<h2>
<%="구구단 출력"%>
</h2>
<%
for (int i = 2; i <= 9; i++) {
%>
<tr>
<%
for (int j = 1; j <= 9; j++) {
%>
<td>
<%
out.println(i + " * " + j + " = " + (i * j));
%>
</td>
<%
}
}
%>
</tr>
</table>
</body>
|
cs |
♣아래의 내용을 참고하여 5단을 출력하시오♣
· JSP의 액션 태그 중 하나인 include를 사용하여 전달받은 값을 출력하도록 할 것!
<구현 화면>
<include.jsp>
|
1
2
3
4
5
6
|
<body>
<h4>구구단 출력하기</h4>
<jsp:include page="include_data.jsp">
<jsp:param name="dan" value="5" />
</jsp:include>
</body>
|
cs |
<include_data.jsp>
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
<body>
<%
int dan = Integer.parseInt(request.getParameter("dan"));
%>
<table>
<%
for (int i = 1; i <= 9; i++) {
%>
<tr>
<td>
<%=dan + " * " + i + " = " + (dan * i)%>
</td>
</tr>
<%
}
%>
</table>
</body>
|
cs |
♣Form 태그를 이용하여 값을 전달하고, 웹브라우저에 출력하시오♣
<구현 화면>
<form01.jsp>
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
<body>
<form action="form01_process.jsp" method="get">
<p>
이름 : <input type="text" name="name" size="15">
</p>
<p>
주소 : <input type="text" name="add" size="15">
</p>
<p>
이메일 : <input type="text" name="email" size="15">
</p>
전송 : <input type="submit" value="전송">
</form>
</body>
|
cs |
<form01_process .jsp>
|
1
2
3
4
5
6
7
8
9
10
11
12
|
<body>
<%
request.setCharacterEncoding("EUC-KR");
String name = request.getParameter("name");
String add = request.getParameter("add");
String email = request.getParameter("email");
%>
<p>아이디 : <%=name %></p>
<p>주소 : <%=add %></p>
이메일 : <%=email %>
</body>
|
cs |
♣Form 태그를 이용하여 값을 전달하고, 웹브라우저에 출력하시오♣
<구현 화면>
<form03.jsp>
|
1
2
3
4
5
6
7
8
|
<body>
<form action="form03_process.jsp" method="post">
오렌지<input type="checkbox" name="fruit" value="오렌지">
사과<input type="checkbox" name="fruit" value="사과">
바나나<input type="checkbox" name="fruit" value="바나나">
<input type="submit" value="전송">
</form>
</body>
|
cs |
<form03_process.jsp>
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
<body>
<%
request.setCharacterEncoding("EUC-KR");
String[] fruit = request.getParameterValues("fruit");
%>
<h4>선택한 과일</h4>
<%
for(String s : fruit){
out.println(s);
}
%>
</body>
|
cs |
♣Calendar를 이용하여 시간정보를 출력하시오♣
<구현 화면>
<time.jsp>
|
1
2
3
4
5
6
7
|
<body>
<h2>몇시 일까요??</h2>
<%
Calendar c = Calendar.getInstance();
out.println(c.getTime());
%>
</body>
|
cs |
'bitcamp > 면접족보' 카테고리의 다른 글
| 면접족보 21/01/05_쿠키, Float 속성 (0) | 2021.02.13 |
|---|---|
| 면접족보 21/01/04_Redirect, Forward (0) | 2021.02.13 |
| 면접족보 20/12/30_JSP 한글처리방식 (0) | 2021.02.13 |
| 면접족보 20/12/29_Servlet 생명주기, CSS개념 (0) | 2021.02.12 |
| 면접족보 20/12/28_HTML 개념, GET/POST 방식 (0) | 2021.02.12 |
