서블릿 라이프사이클

1.
클라이언트의 첫 번째 요청 시 OR 컨테이너가 시작될 때 생성
위의 두 가지 선택지는 컨테이너 속성 값으로 설정

2.
첫 번째의 클라이언트 요청에 대해서만 객체가 생성
   - 서블릿 객체 생성
   - init() 메소드 호출되어 서블릿에 필요한 초기화 작업을 수행
            -init()메소드에서는 서블릿 전체에서 공유되는 자원을 생성

두 번째 부터는 각 클라이언트 마다 스레드를 생성하여 요청 처리
    - 두 번째 요청 시 부터 service() 메소드 호출
    - 요청당 한개의 service() 메소드 호출

컨테이너에서는 service 메소드를 호출하기 전
HttpServletRequest 객체와 HttpServlet Response 객체를 생성하여
service 메소드 파라미터로 전송한다.
    - 클라이언트 요청이 GET방식이면 doGet() 메소드를 호출하고,
    - 클라이언트가 POST 방식이면 doPost() 메소드를 호출한다


 

service() 메서드는 재정의 하지 않는다

 

3. 
컨테이너가 종료될 때 서블릿 객체는 소멸

동작

Client ------------> Server ------------------------------> Container---------------------->Servlet
        1) 1번요청         2) 요청 url 분석 후 서블릿 결정                3) 서블릿 객체 생성
                                                                                       4) init 메소드 호출
                                                                                       5) service 메소드 호출
                                                                                       6) doGet 이나

                                                                                          doPost 메소드 호출
                                                                                       7) destroy 메소드 호출

import java.io.IOException;
import javax.servlet.ServletConfig;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
//서블릿 클래스를 정의한다. 서블릿 클래스를 정의할 때는 HttpServlet 클래스를 상속한다
public class ServletLifeCycle extends HttpServlet {
	private static final long serialVersionUID = 1L;
	//생성자를 정의한 부분이다. 이 부분은 첫 번째 클라이언트 요청이 들어올 때 실행된다.
	public ServletLifeCycle () 
	{
		super();
		System.out.println("Constructor");
	}
	
	//init 메소드를 재정의한 부분이다. 이 메소드는 첫 번째 요청이 들어올 때만 호출된다.
    //두 번째 요청부터는 호출 되지 않는다.
	@Override
	public void init(ServletConfig config) throws ServletException 
	{		
		super.init(config);
		System.out.println("init");
	}
	
	//service 메소드를 정의한 부분이다. 이 메소드는 클라이언트의 요청이 들어올 때 마다 반복적으로 호출되면서 각 클라이언트의 요청을 처리한다.
	@Override
	protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException 
	{
		
		System.out.println("service");
		super.service(request, response);
	}
	//doGet 메소드를 정의한 부분이다. 이 메소드는 클라이언트의 요청이 들어올 때 마다 반복적으로 호출되면서 각 클라이언트의 요청을 처리한다.
	protected void doGet (HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException 
	{
		System.out.println("doGet");
	}
	//doPost 메소드를 정의한 부분이다. 이 메소드는 클라이언트가 post 방식으로 요청을 하면 호출된다.
	protected void doPost (HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException
	{
		System.out.println("doPost");
	}
	//destroy() 메소드를 정의한 부분이다. 서블릿 인스턴스가 소멸되기 직전에 단 한번만 호출되는 메소드이다. 톰캣 서비스를 중지하면 실행된다.
	@Override
	public void destroy()
	{
		System.out.println("destroy");
		super.destroy();
	}
}

 

          

 

 

 

 

Keyword : 

셀 병합 : <colspan>세로끼리 합치기, <rowspan> 가로줄끼리 합치기,

테이블 제조 : <table>, <tr>, <td>, <th>

<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
</head>
<body>
		<hr>
		<h1>table로 만드는 표</h1>
		<hr>
		
		<table border = 1>
			<tr>
				<td>1 cell</td>
				<td>2 cell</td>
			</tr>
			
			<tr>
				<td>3 cell</td>
				<td>4 cell</td>
			</tr>
		</table>
		
		<br><br>
		
		<table border = 1>
			<tr>
				<td>1</td>
				<td>2</td>
				<td>3</td>
			</tr>
		
			<tr>
				<td>4</td>
				<td>5</td>
				<td>6</td>
			</tr>
			
			<tr>
				<td>7</td>
				<td>8</td>
				<td>9</td>
			</tr>
		</table>
		
		<br><br>
		
		<table border = 1>
				<tr>
					<th>table</th>
					<td>표를 구성하는 가장 큰 태그</td>
				</tr>
				
				<tr>
					<th>tr</th>
					<td>줄을 구성하는 태그</td>
				</tr>
				
				<tr>
					<th>th</th>
					<td>제목칸을 구성하는 태그 특징(볼드체, 중앙정렬)</td>
				</tr>
				
				<tr>
					<th>td</th>
					<td>일반칸을 구성하는 태그</td>
				</tr>
		</table>
		
		<h1>※첫줄이 제목칸인 표만들기</h1> <br><br>
		
		<table border = 1>
			<tr>
				<th>번호</th>
				<th>이름</th>
				<th>불참</th>
			</tr>
			
			<tr>
				<td>0</td>
				<td>불참자없음</td>
				<td> </td>
			</tr>
			
			<tr>
				<td>1</td>
				<td>서에번쩍</td>
				<td> </td>
			</tr>
			
			<tr>
				<td>2</td>
				<td>동에번쩍</td>
				<td> </td>
			</tr>
		
		</table>
		<br>
		<hr>
		<h1>셀(칸)합치기</h1>
		<hr>
		
		<table border = 1> 
			<tr>
				<td>colspan=n</td>
				<td>가로로 n개만큼 하나로 합치기</td>
			</tr>
			
			<tr>
				<td>rowspan=n</td>
				<td>세로로 n개만큼 하나로 합치기
			</tr>
		</table>
	
		<hr>
		<hr>
		
		<table border = 1>
			<tr>
				<th colspan = 2>셀(칸)합치기</th>
			</tr>
			
			<tr>
				<td>colspan</td>
				<td>rowspan</td>
			</tr>
		</table>
		
		<table border = 1>
			<tr>
				<td>1</td>
				<td>2</td>
				<td>3</td>
			</tr>
			
			<tr>
				<td colspan = "3">4</td>
			</tr>
		</table>
		
		<hr>
		<br><br><br><br>
		
		<h3>가로합치기 - colspan</h3>
		
		<table border = "1">
			<tr>
				<td>a</td>
				<td>b</td>
				<td>c</td>
				<td>d</td>
			</tr>
			
			<tr>
				<td colspan = "2">e</td>
				<td colspan = "2">f</td>
			</tr>
			
			<tr>
				<td colspan = "3"> g</td>
				<td>h</td>
			</tr>
		</table>
		
		<h3>세로로 합치기 - rowspan</h3>
		
		<table border = "1">
			<tr>
				<td rowspan = "2"> 셀(칸) 합치는 속성 </td>
			</tr>
			
			<tr>
				<td>colspan</td>
				<td>rowspan</td>
			</tr>
		</table>
		
		<hr>
		<h2>세로로 합치기</h2>
		<table border = "1">
			<tr>
				<td rowspan = "3">1</td>
				<td>2</td>
			</tr>
			
			<tr>
				<td>3</td>
			</tr>
			
			<tr>
				<td>4</td>
			</tr>
		</table>
		
		<h2>문제. 세로로 합치기</h2>
		<table border ="1">
			<tr>
				<td>a</td>
				<td rowspan = "3">b</td>
				<td>c</td>
			</tr>
		
			<tr>
				<td>d</td>
				<td rowspan = "2">e</td>
			</tr>
			
			<tr>
				<td>f</td>
			</tr>
		</table>
		
		<table border = "1">
			<tr>
				<td colspan = "2">기타사항</td>
				<td> </td>
			</tr>
			
			<tr>
				<td rowspan = "4">특기사항</td>
				<td>지각자</td>
				<td> </td>
			</tr>
			
			<tr>
				<td>결석자</td>
				<td> 홍길동, 길동홍, 동길홍, 길홍동</td>
			</tr>
			
			<tr>
				<td>조퇴자</td>
				<td> </td>
			</tr>
			
			<tr>
				<td> 그 밖의 </td>
				<td> -외출: <br> -휴가: <br>  -지각 &조퇴:  </td>
			</tr>
		</table>	
</body>
</html>

 

'HTML' 카테고리의 다른 글

[HTML/CSS] 형제 태그 선택자 +, ~  (0) 2019.11.06
<a>태그 / <embed>태그  (0) 2019.06.14
이미지 태그 <img>  (0) 2019.06.04
목록태그 <ol> , <ul> , <dl>  (0) 2019.06.04

 

1. 태그선택 <a> $("a")
2. 클래스 선택 <a class = "cls"> $(".cls")
3. ID 선택 <a id = "sel"> $("#sel")
4. 속성 선택 <a id = "sel" name ="txt"> $("[name = txt]") 
5. 모든 요소(태그) 모든요소(태그) 선택 $("*")

 

 

$("p:eq()");

 

$("button:eq(1)").Text();  --> 두번째 button 선택

<dd class="zoom">
	<button>+</button>
    <button>0</button>
    <button>-</button>
</dd>

 

 

 

 

메소드 영역

- 클래스 사용시 JVM이 해당 클래스 파일을 읽어서 (~.class)

클래스 데이타를 Method Area에 저장한다.

이 때, 해당 클래스의 클래스 변수도 메소드 영역에 생성된다

 

힙 영역

- 인스턴스 생성 공간

EX)인스턴스 변수

 

호출 스택

 

메서드 호출시 -> 호출 스택에 메서드를 저장하기 위한 메모리 할당 -> 해당 메모리는 해당 메서드가 작업을 수행하는

동안에 지역 변수 매개변수들이 저장되는데 사용된다.

메서드가 종료되면 메모리를 반환한다.

 

먼저 실행된 메서드가 가장 늦게 반환된다.

즉, main메소드가 가장 먼저 프로그램 실행시 call stack영역영 가장 아래에 쌓인다.

그다음으로 호출되는 메서드가 차례로 쌓이고 가장 나중에 실행된 메서드가 종료시 부터 메모리가 반환된다.

 

기본형 매개 변수

x = 100;

참조형 매개변수

int x;

 

1. 클래스 메서드 (static 메서드)

클래스이름.해당메서드();

2 .인스턴스 메서드

클래스 변수 객체 = 인스턴스 메서드();

객체.해당메서드();

 

인스턴스 변수는 항상 클래스 멤버를 참조할 수 있다.

하지만 클래스 변수는 클래스 생성시에 생성되는데에 반해

인스턴스변수는 인스턴스 변수를 객체에 담아야 비로소 생성이된다.

따라서

클래스 변수는 인스턴스 변수를 참조하기위해서는 인스턴스 변수가 객체에 담긴후여야한다.

 

'JAVA' 카테고리의 다른 글

추상클래스  (0) 2019.10.30
[JAVA] 추상클래스/인터페이스  (0) 2019.10.08
인스턴스 생성/인스턴스 변수/클래스 변수  (0) 2019.09.04
클래스와 객체  (0) 2019.09.03
1) 변수 , 자료형  (0) 2019.08.26
package practice;

class CardTest {
	public static void main(String[] args)
	{
		Card.width = 10;
		Card.height = 20;
		
		Card card = new Card();
		card.kind = "Spade";
		card.number = 7;
		
	}
}
class Card{
	String kind;
	int number;
	static int width = 100;
	static int height = 250;
}

class Card{

 

}

 

클래스 변수와 인스턴스 변수 구분

 

클래스 생성 시 static 변수가 생성되어서 클래스 변수라고함

static 변수 생성 = static 변수를 클래스 변수라고 함

static int  width = 100; 에 접근하는 법

static int height = 250;

 

main에서 Card 클래스의 객체 card 를 생성하고 = 인스턴스생성 구문인 new Card();를 적으면

인스턴스 변수인 int number; 와 String kind; 가 생성된다.

 

 

인스턴스 생성될 때 생성되는 변수 = 인스턴스 변수

클래스가 생성될 때 생성되는 변수 = 클래스 변수

 

CardTest{

      public static void main(String[] args)

      {

          /방법 1

          클래스이름.width = 10;

          클래스이름.height = 200;

          

          /방법 2

          Card card = new Card(); //인스턴스 생성

          card.width = 10;

          card.width = 200;

          

      }

}

 

 

 

 

'JAVA' 카테고리의 다른 글

추상클래스  (0) 2019.10.30
[JAVA] 추상클래스/인터페이스  (0) 2019.10.08
JVM 메모리구조/인스턴스 변수 / 멤버 변수  (0) 2019.09.05
클래스와 객체  (0) 2019.09.03
1) 변수 , 자료형  (0) 2019.08.26

클래스

- 클래스에 선언된 변수 = 멤버 변수라고 함 (속성)

- 클래스에 선언된 함수 = 메서드라고 함 (기능)

 

메인 메서드에서

- 객체(인스턴스) 생성방법

클래스 타입(클래스 이름임)    참조변수(클래스 객체)  =  new(키워드)   TV() (인스턴스 생성자 메서드)  ;

 

public class TV

{

     boolean power;  // 멤버 변수 (속성)

     int channel;

   

     void channelUp(){++channel};

     void power(); //  메서드(함수)

}

 

public static void main(String[] args)

{

     TV tv = new TV(); // 1. TV는 클래스 타입 (사용자 정의 타입)

                            //  2. tv는 참조 변수 = 객체

                            //  3. new TV(); 인스턴스 생성

     tv.channelUp();    //  tv.channel = 0; 를 해주지 않아도 자동으로 객체 생성시 0으로 초기화됨

                            //  따라서 tv.channelUp();을 실행하면 +1되어 1이 출력 될것임.

     System.out.println("tv의 채널은" + tv.channel + "입니다");

 

 

 

}

 

객체 생성시 초기화되는 값들

int 형 멤버 변수 0

String형 (참조 변수) null

boolean false

 

 

 

'JAVA' 카테고리의 다른 글

추상클래스  (0) 2019.10.30
[JAVA] 추상클래스/인터페이스  (0) 2019.10.08
JVM 메모리구조/인스턴스 변수 / 멤버 변수  (0) 2019.09.05
인스턴스 생성/인스턴스 변수/클래스 변수  (0) 2019.09.04
1) 변수 , 자료형  (0) 2019.08.26
변수

1) 변수 = 값을 저장할 수 있는 메모리상의 공간

 

2) 변수 이름 정하는법

    I) 예약어 제외

   II) 아무이름이나 가능하지만 의미 있는 이름을 쓰는것이 가독성이 좋다.

 

3) 변수 선언

   규칙 :

변수 타입 변수이름;

int cake;

 

4) 사용

변수에 값을 넣어줌

int cake = 10;

 

자료형(타입)

(8bit) = 1byte

정수형

- byte(8), int(32), short(16), long(64)

 

실수형

-float(32), double(64)

 

문자형 

-char(16)

 

논리형

-boolean(8)

 

 

 

 

   

 

 

'JAVA' 카테고리의 다른 글

추상클래스  (0) 2019.10.30
[JAVA] 추상클래스/인터페이스  (0) 2019.10.08
JVM 메모리구조/인스턴스 변수 / 멤버 변수  (0) 2019.09.05
인스턴스 생성/인스턴스 변수/클래스 변수  (0) 2019.09.04
클래스와 객체  (0) 2019.09.03

https://docs.oracle.com/javase/8/docs/api/
public class Test2 {

public static void main(String[] args)
{
// TODO Auto-generated method stub
System.out.println();
int count; // 변수 선언

// count = 100;
// System.out.println(count);
//
// count = 200;
// System.out.println(count);

char c;
c = '가';//문자표 = 자바는 유니코드를 사용
System.out.println(c);

// 주석처리방법
// 컨트롤 +/
// 자바에서 사용하는 데이터 형
// 기본형
// 1. 정수형 int(32), long(64), short(16), byte(8) 1byte = 8bit 10
// 2. 실수형 double(64), float(32) 10.0
//처음은 부호비트(1) / 지수(11) / 가수(52)
// 3. 문자형 char 'a' , '가'
// 4. 논리형 boolean /true, false
// 1byte = 8 bit
// 0000 0000 ~ 1111 1111 (0) ~ (255)
// 0 000 0000 맨 앞자리는 0 이면 +/ 1이면 -를 나타내기때문에
// -128 ~ 127
// int x = 1; 0000 0000 0000 0000 0000 0000 0000 0001
// byte y = 1; 0000 0001
// 기타...
//클래스타입형(참조타입형)
}

}

c클래스 - 호스트수 = 서브넷

 

RIP HOP COUNT

 

ARP 중복아이피도 갱신됨

 

ARP    IP <->MAC?

RARP  

 

클래스 비트

A0000 0000 

B1000 0000

C1100 0000

D1110 0000

E1111 0000

 

A0.0.0.0 ~ 127.0.0.0

B128.0.0.0 ~ 191.255.0.0

C192.0.0.0 ~ 223.255.255.0

D224.0.0.0 ~ 239.255.255.255

E240.0.0.0 ~ 247.255.255.255

 

 

DOMAIN NAME -> IP 요청하는 것 = NSLOOKUP

 

RIP 방향거리 프로토콜

OSPF (Open Shortest Path First) 링크 스테이트 프로토콜

BGP(Border Gateway Protocol) 각자 라우터에 as를 부여하여 연결

 

DNS -

도메인에 대하여 IP주소를 매핑

IP주소를 도메인 이름으로 변환

계층적 이름 구조를 갖는 분산형 데이터 베이스로 구성되고 클라이언트 서버. 모델을 사용한다. 

DHCP

IP주소를 관리하기 위해 IP주소, 서브넷 마스크, 게이트웨이 주소를 자동으로 할당해준다

 

최적의 경로 선택 - 라우터 = 네트워크 계층
CSMA/CD= 자신외에 다른 송신자가 네트워크를 사용하는 지 점검
BUS TOPOLOGY
-터미네이터가 시그널의 반사를 방지하기 위해 사용
스타형
-문제가 발생한 위치를 파악하기 쉽다
-각 스테이션이 중앙 스위치에 연결
링형
-Token passing

전기적 신호 = 물리계층
데이터 링크 계층 = 인접한 point to point
Qos = 전송계층
라우팅 = addressing

전송계층 - tcp, udp 프로토콜
802.11a(54),b(11),g,n(600)
->뒤로 갈수록 최신것. 빠름

성능 모니터 도구
- 성능 모니터에서는 성능 매개변수에 해당하는 선택된 카운터에 대해 통계정보를 보여준다
- 리소스 모니터는 시스템의 4개 핵심 리소스를 대상으로 계속 카운터를 캡쳐해 보여준다.
- 안정성 모니터는 1부터 10까지 안정성 인덱스를 이용해 시스템 안정성을 보여준다

롤백할 때 이전상태로 안되돌리는것
-파일시스템과 레지스트리

아파치 웹서버의 서버측 에러 메세지
-500 internal server error 내부서버 오류
-501 not implemented 클라이언트에서 서버가 수행할 수없는 행동을 요구
-502 bad gateway 서버의 과부화
-503 service unavailable 현제 멈춤상태

dhcp 부터 새로운 ip주소를 부여 받는법
ipconfig /renew

 

 

 

 

<a>태그
속성 설명
href

연결할 문서의 경로나 url 지정

#name : 동일 문서에 name으로 지정한 곳으로 이동

mailto:받는사람메일주소?subject="제목" : 메일 보낼 때의 링크 지정

기타 : 내려받을 위치 지정

name 동일 문서 내 특정 위치로 이동하는 책갈피 기능
target 링크된 내용이 열릴 대상(_blank, _parent, _self, _top) 을 지정

 

<embed>태그
속성 설명
src 웹 페이지에 삽입할 파일 경로 or URL 지정
autostart 웹 페이지를 열었을 때 사운드 파일을 자동 재생여부(True,False)
hidden 미디어 플레이어를 화면에서 감출지 여부(True, False)를 지정
width 콘텐츠의 너비 지정(픽셀)
height 콘텐츠의 높이 지정(픽셀)
loop 파일 재생 반복 횟수(숫자) or True 무한 / False 한번만

 

 

<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>a / embed / tag</title>
</head>
<body>
	노래 재생!<br>
	<embed src="https://www.youtube.com/embed/EXuF5oa0VPI" width="500" height="300" autostart="true" loop="false"/>
	<br>
	링크<br>
	<a href ="https://www.naver.com">네이버</a>
	링크<br>
	<a href ="https://youtube.com">유튜브</a>
	
</body>
</html>

https://youtu.be/EXuF5oa0VPI>동영상 url 복사 누르면 이렇게 복사가 되는데

그것 말고 소스 복사를 누르고 주소만 따로 복사해서 쓰면 연결거부가 안뜸

 

'HTML' 카테고리의 다른 글

[HTML/CSS] 형제 태그 선택자 +, ~  (0) 2019.11.06
<table> 태그  (0) 2019.10.01
이미지 태그 <img>  (0) 2019.06.04
목록태그 <ol> , <ul> , <dl>  (0) 2019.06.04
경로 지정

동일 폴더 : 파일이름.확장자

상위 폴더 : ../파일이름.확장자

하위 폴더 : 폴더이름/파일이름.확장자

 

<img> 태그

http://웹서버주소(ip):8080/파일이름.확장자

태그 속성
속성 설명
src 경로 or URL
alt 이미지가 안나왔을 때 대신 나올 글
align 정렬 (left, right, top, middle, bottom)
border 이미지 테두리(숫자) 지정 , 0일때 테두리x
height 이미지 높이 지정
width 이미지 너비 지정
hspace 좌우 여백
vspace  상하 여백

 

<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
</head>
<body>
	<dl>
	<dt>사진</dt>
		<dd>
			<img width="300px" height="300px" 
			src="qwer.jpg"/>
		</dd>
	</dl>
	<dl>
	
	<dt>사진</dt>
		<dd>
			<img width="300px" height="300px" 
			src="http://localhost:8080/MakeWeb/qwer.jpg"/>
		</dd>
	</dl>
	
	<dl>
	<dt>사진</dt>
		<dd>
			<img width="300px" height="300px" 
			src="https://get.pxhere.com/photo/mac-space-galaxy-nebula-outer-space-universe-fantasy-astronomical-object-irxsiempre-741629.jpg"/>
		</dd>
	</dl>

</body>
</html>

'HTML' 카테고리의 다른 글

[HTML/CSS] 형제 태그 선택자 +, ~  (0) 2019.11.06
<table> 태그  (0) 2019.10.01
<a>태그 / <embed>태그  (0) 2019.06.14
목록태그 <ol> , <ul> , <dl>  (0) 2019.06.04
<ol>태그

Ordered List의 약자로 순번이 있는 목록으로 정렬할 때 사용!

목록의 항목을 표시하는 <li> 태그와 함께 사용!

 

<ol>태그

속성 설명
type 각각의 목록 앞에 붙는 표식(A,a, I, i, 1)
start 시작 번호를 지정

 

<ul>태그

Unordered List 약자로 순번이 없는 목록!

<li>태그와 함께 사용

 

속성 설명
type 각각의 목록 앞에 붙는 표식(disc, circle, square) 지정, 기본값은 disc

 

<dl> 태그

Dictionary List 약자 순번이 없는 목록!

<li> 대신 <dt> 와 <dd> 사용

 

<html>
	<head>
		<title> HTML </title>
	 </head>
	
	<body>
		<ol type="a" start="1">
		<li> 아침 </li>
		<li> 점심 </li>
		<li> 저녁 </li> 
		</ol>
		
		<br/><br/>
		
		<ul type="disc">
		<li> 아침 </li>
		<li> 점심 </li>
		<li> 저녁 </li>
		</ul>

		<ul type="circle">
		<li> 아침 </li>
		<li> 점심 </li>
		<li> 저녁 </li>
		</ul>

		<ul type="square">
		<li> 아침 </li>
		<li> 점심 </li>
		<li> 저녁 </li>
		</ul>

		<dl>
			<dt>아침밥</dt>
			<dd>삼겹살!</dd>
			
			<dt>점심밥</dt>
			<dd>탕수육!</dt>

			<dt> 저녁밥 </dt>
			<dd> 라면! </dt>
		</dl>


	</body>
</html>

'HTML' 카테고리의 다른 글

[HTML/CSS] 형제 태그 선택자 +, ~  (0) 2019.11.06
<table> 태그  (0) 2019.10.01
<a>태그 / <embed>태그  (0) 2019.06.14
이미지 태그 <img>  (0) 2019.06.04
<font> 태그 - 글꼴 태그
속성 설명
face 글꼴
color 색상
size 글꼴 크기 지정(1~7) , 디폴트 3

 

<strong> 굵게

<i> 이텔릭체

<u> 밑줄

<sup> 윗 첨자

<sub> 아랫 첨자

<s> 텍스트 가운데 줄

<blockquote> 문단을 들여써서 하나의 덩어리로 표시

<xmp> 코드에 작성한 내용중에 태그도 표시

<pre> 코드에 작성한 내용 그대로 표시

 

<html>
	<head> 폰트 태그 </head>
	
	<xmp>
	<font face="바탕체" color="blue" size="7"> 바탕체 파란색 사이즈 7의 글꼴 </font> 
	</xmp>
	<font face="바탕체" color="blue" size="7"><i>바탕체 파란색 사이즈 7 이텔릭 </i></font> 
	</br></br></br>

	<xmp>
	<font face="바탕체" color="blue" size="7"><strong> 바탕체 파란색 사이즈 7의 굵게(strong) 글꼴 </strong> </font>
	</xmp>
	<font face="바탕체" color="blue" size="7"><strong> 바탕체 파란색 사이즈 7의 굵게(strong) 글꼴 </strong> </font>
	</br></br></br>

	<xmp>
	<font face="고딕" color="red" size="7"><strong><i><u> 고딕체 빨강 7사이즈 강조 이텔릭 밑줄</u> </i></strong></font>
	</xmp>
	<font face="고딕" color="red" size="7"><strong><i><u> 고딕체 빨강 7사이즈 강조 이텔릭 밑줄</u> </i></strong></font>
	</br></br></br>

	<xmp>
	<font face="굴림체" color="yellow" size="7"><strong><s> 굴림체 노랑 7사이즈 강조 중앙줄 </s></strong></font>
	</xmp>
	<font face="굴림체" color="yellow" size="7"><strong><s> 굴림체 노랑 7사이즈 강조 중앙줄 </s></strong></font>
	</br></br></br>

	<xmp>
	<font face="돋움체" color="black" size="7">x<sup>2</sup>=2<sup>2</sup></font>
	</xmp>
	<font face="돋움체" color="black" size="7">x<sup>2</sup>=2<sup>2</sup></font>
</html>

결과

<hr>태그 - 수평선 태그

 

 

속성 설명
align 수평선 정렬 (left, right, center)
color 색상
size 굵기 (단위 숫자)
width 가로 길이 ( 단위 %)
noshade 그림자가 없는 평면 수평선 

 

 

 

 

<h>태그 - 헤드라인 태그

1~6 사이의 숫자와 사용하고 글자의 크기를 지정한다.

<h1> 안녕하살법! </h1>

<h6> 안녕하살법! </h6>

 

 

<html>
	<head>
		<title> hr, h 태그 </title>
	</head>
	
	<body>
		<h1> h1은 크다</h1>&nbsp;&nbsp; <h6>h6은 작다 </h6>
		
		<hr width = "50%" color = "blue" align = "center"></hr>

		<h1> 안녕하살법! </h1>
		<h2> 안녕하살법! </h2>
		<h3> 안녕하살법! </h3>
		<h4> 안녕하살법! </h4>
		<h5> 안녕하살법! </h5>
		<h6> 안녕하살법! </h6>
		<h7> 안녕하살법! </h7>
		<h8> 안녕하살법! </h8>
	</body>
</html>

 

 

 

 

  • 책에는 <h1>~<h6>까지 쓴다했지만 궁금하여 <h7>과 <h8>을 해본결과 
  • <h7> = <h4>와 같은 크기로 출력되고 대신에 글씨 두께가 다르게 나온다.
  • 그리고 맨 윗줄의 <h1> h1은 크다 </h1> <h6> h6은 작다 </h6>는
  • 처음에 &nbsp;를 써서 공백을 줘야겠다 생각한 것인데 결과는 조금 다르다.
  • <h>태그는 태그종료가 되면 줄바꿈을 한다. 

 

이 때는 아래의 사진과 같이 &nbsp;를 줄바꿈으로 인식하여 위아래 간격이 늘어난다.

 

 

 

 

#include  <stdio.h>

int main() 
{ 
	int A[6][6]; // 5행X 5열
	int K=5;// 각 회전 당 N값의 갯수 //회전당 출력되는 n갯수 
	int N=0;// 1씩 증가되는 숫자 처리
	int S=1;// 행열의 증가/ 방향전환
	int I=1;//행  
	int J=0;//열
	int p;
	
	
	//printf
	int i;
	int j;
	
	//  (i,j)
	/*  (1,1) (1,2) (1,3) (1,4) (1,5)
		(2,1) (2,2) (2,3) (2,4) (2,5)
		(3,1) (3,2) (3,3) (3,4) (3,5)
		(4,1) (4,2) (4,3) (4,4) (4,5)
		(5,1) (5,2) (5,3) (5,4) (5,5) 
	*/
		
	//  (i,j)
	/*  (1,1) (1,2) (1,3) (1,4) (1,5)
								(2,5)
								(3,5)
								(4,5)
								(5,5) 
	*/
		//  (i,j)
	/*  (1,1) (1,2) (1,3) (1,4) (1,5)
								(2,5)
								(3,5)
								(4,5)
		(5,1) (5,2) (5,3) (5,4) (5,5) 
	*/
	/*  (1,1) (1,2) (1,3) (1,4) (1,5)
		(2,1)					(2,5)
		(3,1)					(3,5)
		(4,1)					(4,5)
		(5,1) (5,2) (5,3) (5,4) (5,5) 
	*/
	/*  
		(1,1) (1,2) (1,3) (1,4) (1,5)
		(2,1) (2,2) (2,3) (2,4) (2,5)
		(3,1)					(3,5)
		(4,1)					(4,5)
		(5,1) (5,2) (5,3) (5,4) (5,5) 
	*/
	/*  
		(1,1) (1,2) (1,3) (1,4) (1,5)
		(2,1) (2,2) (2,3) (2,4) (2,5)
		(3,1)			  (3,4)	(3,5)
		(4,1)			  (4,4) (4,5)
		(5,1) (5,2) (5,3) (5,4) (5,5) 
	*/
	
	/*  
		(1,1) (1,2) (1,3) (1,4) (1,5)
		(2,1) (2,2) (2,3) (2,4) (2,5)
		(3,1)			  (3,4)	(3,5)
		(4,1)			  (4,4) (4,5)
		(5,1) (5,2) (5,3) (5,4) (5,5) 
	*/
	/*  
		(1,1) (1,2) (1,3) (1,4) (1,5)
		(2,1) (2,2) (2,3) (2,4) (2,5)
		(3,1)			  (3,4)	(3,5)
		(4,1) (4,2) (4,3) (4,4) (4,5)
		(5,1) (5,2) (5,3) (5,4) (5,5) 
	*/
		/*  
		(1,1) (1,2) (1,3) (1,4) (1,5)
		(2,1) (2,2) (2,3) (2,4) (2,5)
		(3,1) (3,2)	      (3,4)	(3,5)
		(4,1) (4,2) (4,3) (4,4) (4,5)
		(5,1) (5,2) (5,3) (5,4) (5,5) 
	*/
		/*  
		(1,1) (1,2) (1,3) (1,4) (1,5)
		(2,1) (2,2) (2,3) (2,4) (2,5)
		(3,1) (3,2)	(3,3) (3,4)	(3,5)
		(4,1) (4,2) (4,3) (4,4) (4,5)
		(5,1) (5,2) (5,3) (5,4) (5,5) 
	*/
	while(K>0)
	{
		for(p=1; p<K+1; p++)
		{
			//가 로 
			//(1,1) (1,2) (1,3) (1,4) (1,5)
			//N 1 ~ 25 
			N = N + 1; 
			//j가 증가
			//i는 고정  
			J = J + S; // S만큼 증가 S = 1 
			A[I][J] = N;
		}
		//5 4 4 3 3 2 2 1 1 
		K = K - 1;
		
		if(K > 0)
		{
			for(p=1; p<K+1; p++)
			{
				//세로 
				N = N + 1;
				// I가 증가
				// J는 고정
				// 증가량 S = 1
				I = I + S;
				A[I][J] = N; 
			}
		}
		S = S*(-1);
	}

	for(i = 1; i <= 5; i ++)
	{
		for(j = 1; j <=5; j++)
		printf("   %d       ", A[i][j]);
		printf("\n");
	}
}

1. tcpschool.com

2. 유튜브 생활코딩

3. 웹 html css xml js

4. 자바 java jQuery DB

<p> 태그


<p>태그는 문단 태그로 단을 정렬할 때 사용한다.

 

단락을 나누는데에는 문단을 정렬하는 데에 목적이 있다.

따라서 글을 어떻게 배치할 것인지 정렬하는 속성을 지정할 수 있는데

 

속성 설명
align 문단정렬 ( left, right, center )

 

<html>
	<head>
		<title> 제목을 적는 곳인가? </title>
	</head>
	
	<body>
		<p align="center">
		띄어쓰기를 해봅니다.!!!!!!!!!</br>
		</p>

		<p align="right">
		한칸 두칸 세칸을 차례로 
		1 @
		2  @
		3   @
		</p>
	</body>
</html>




 




 

'JSP' 카테고리의 다른 글

[JSP] 14 . HTML 텍스트 태그 <font>  (0) 2019.05.27
[JSP] 13 - 3 . HTML 문단 태그 <hr> <h>  (0) 2019.05.27
[JSP] 13 - 1 . HTML 문단 태그 <br>  (0) 2019.05.23
[JSP] 13. HTML 문단 태그  (0) 2019.05.23
[JSP] 12. HTML ?  (0) 2019.05.23
<br> 태그

<html>
	<head>
		<title> 제목을 적는 곳인가? </title>
	</head>
	
	<body>
		띄어쓰기를 해봅니다.!!!!!!!!!</br>
		한칸 두칸 세칸을 차례로 
		1 @
		2  @
		3   @
	</body>
</html>


실제쓰임은  닫힘태그만 쓴다고 합니다

 

</br> 태그를 쓰자 결과가 나옵니다

 

 

'JSP' 카테고리의 다른 글

[JSP] 13 - 3 . HTML 문단 태그 <hr> <h>  (0) 2019.05.27
[JSP] 13 - 2 . HTML 문단 태그 <p>  (0) 2019.05.23
[JSP] 13. HTML 문단 태그  (0) 2019.05.23
[JSP] 12. HTML ?  (0) 2019.05.23
[JSP] 11. HTML 작성  (0) 2019.05.16

<문단태그> 


텍스트를 좌측정렬을 하거나 우측정렬을 하거나 등 한 칸 띄어쓰는 것 부터 시작해서

단을 나누거나 EX) 글을 작성하고 들여쓰거나 단을 나누거나 하는 편집적인 요소 라고 생각

 

 


위의 사진은 내가 책을 한번 읽고 HTML에서는 &nbsp; (한칸띄움) 와 같은 예약어(Keyword)가 두 칸 이상을 띄어쓸때

꼭 필요하다고 해서 확인을 하기 위해 한 칸을 띄어써보고 두 칸을 띄어 써보고 하면서 나온결과이다.

 

<html>
	<head>
		<title> 제목을 적는 곳인가? </title>
	</head>
	
	<body>
		띄어쓰기를 해봅니다.!!!!!!!!!
		한칸 두칸 세칸을 차례로 
		1 @
		2  @
		3   @
	</body>
</html>

  HTML문서에 줄 바꿈과 띄어쓰기처럼 같은 결과가 나오기를 바라면서 적은 것이지만 실제로는 그렇지 않았다.

띄어쓰기도 한번 띄어쓰기가 최대였다. 

 

<알아볼 것 - <br> <p> <h> <hr> 


일단 그리하여 궁금한 것이 두가지 생겼는데 &nbsp; 이 의미모를 것 부터 시작해서

줄 바꿈도 필요함이 보인다.

  • &nbsp; 는 무엇인가
  • 그 외 줄바꿈과 단 나눔 같은 더 많은 기능은 어떤 것이 있을까?

 

줄 바꿈 없는 공백(non-breaking space, no-break space, 줄여서 NBSP) 또는 단어 잘림 방지 공백[1], 줄 바꿈하지 않는 공백[2]은 공백 문자의 한 형태로, 현 위치에서 자동 줄 바꿈(워드랩)을 막는 데 쓰인다. 고정 공백이라고도 한다.

 

-> &nbsp; 는 영어약자이다!

 

 

줄 바꿈하는 태그를 먼저 소개하자면

<br> 이다.  끝 태그가 필요없지만 </br> 같이 시작태그를 적지 않고 그 자리에 </br>만 써주는 식으로 사용한다고 한다.

 

 

'JSP' 카테고리의 다른 글

[JSP] 13 - 2 . HTML 문단 태그 <p>  (0) 2019.05.23
[JSP] 13 - 1 . HTML 문단 태그 <br>  (0) 2019.05.23
[JSP] 12. HTML ?  (0) 2019.05.23
[JSP] 11. HTML 작성  (0) 2019.05.16
[JSP] 10. Tomcat서버에 HTML 작성하여 띄워보기  (0) 2019.05.16