본문 바로가기

웹개발 수업/HTML

[Day +51 / HTML]4. 영역관련 태그(영역, 이미지, 미디어, 하이퍼링크, 폼 관련 태그)

210902 목

 

4) 영역 관련 태그

4-1) head 부분

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>04_영역 관련 태그</title>
    <style>
        div{
            border : 1px solid black;
        }

        #div1 {
            background-color: red;
        }

        #div2 {
            background-color : yellow;
        }

        #div3 {
            background-color : greenyellow;
        }

        span{
            border : 1px solid black;
        }

        #span1 {
            background-color: red;
        }

        #span2 {
            background-color : yellow;
        }

        #span3 {
            background-color : greenyellow;
        }
    </style>
</head>

4-2) div 태그

<body>
    <h1>영역 관련 태그</h1>
    
    <h2>div 태그와 span태그의 차이1 : 줄바꿈</h2>

    <h3>div 태그</h3>
    <p>
        div 태그 영역은 이미 존재하는 태그 다음 줄에 영역이 설정된다<br>
        block 형식 : 공간을 수직으로 분할함
    </p>

    <div id = "div1">
        첫 번째 영역
    </div>
    <div id = "div2">
        두 번째 영역
    </div>
    <div id = "div3">
        세 번째 영역
    </div>

    <hr>

4-3) span 태그

 <h3>span 태그</h3>
    <p>
        span 태그 영역은 줄바꿈이 일어나지 않고 옆으로 영역이 설정된다<br>
        inline 형식 : 공간을 수평으로 분할함
    </p>   
    <span id = "span1">첫 번째 영역</span>
    <span id = "span2">두 번째 영역</span>
    <span id = "span3">세 번째 영역</span>

    <hr>

4-4) div태그2

 <h2>div 태그와 span 태그의 차이 2 : 영역 지정 방식</h2>
    <b>div 영역 : 사각형 박스로 영역을 지정</b>
    <div style = "background-color: yellow;">
        동해물과 백두산이 마르고 닳도록<br>
        하느님이 보우하사 우리나라 만세<br>
        무궁화 삼천리 화려강산<br>
        대한 사람, 대한으로 길이 보전하세
    </div>

    <hr>

4-5) span 태그2

 <b>span영역 : 문장 단위로 영역을 지정</b><br>
    <span style = "background-color: cyan;">
        동해물과 백두산이 마르고 닳도록<br>
        하느님이 보우하사 우리나라 만세<br>
        무궁화 삼천리 화려강산<br>
        대한 사람, 대한으로 길이 보전하세
    </span>

    <hr>

4-6) ifame 태그

<h3>ifram 태그</h3>
    <p>
        웹 문서 안에 다른 웹 페이지를 추가하는 태그(inline 형식)
    </p>

    <iframe width="1200px" height = "800px" src = "https://www.iei.or.kr" framborder ="0"> </iframe><br>
    <iframe width="500px" height = "850px" src = "C:\Users\jemen\Pictures\Camera Roll\부승관.jpg" framborder ="0"> </iframe><br>
    <iframe width="754" height="424" src="https://www.youtube.com/embed/EhbdRiFsYB4" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
    

</body>
</html>

소스코드 복사는 유튜브 재생 화면에서 오른쪽 마우스 클릭

 

5) 이미지 관련 태그

5-1) 이미지 태그

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>05_이미지 관련 태그</title>
</head>
<body>

    <h1>이미지 관련 태그</h1>

    <h3>src 속성</h3>
    <p>
        src속성에 경로를 설정하여 이미지 파일을 불러옴
    </p>
    <img src = "sample/image/river1.PNG">
    
    <hr>

5-2) 엑박시 alt 속성 설정

  <h3>alt 속성</h3>
    <p>
        사진의 경로가 잘못되거나 이미지를 제대로 표현할 수 없는 경우
        대체 텍스트의 용도로 사용<br>
        또는 시각 장애인을 위한 화면 낭독기 프로그램에서 이미지를 대체하는
        텍스트를 작성
    </p>
    <img src = "sample/image/river.PNG" alt="강 사진">

    <hr>

5-3) 사진의 높이와 너비 설정

<h3>width와 height</h3>
    <p>
        사진의 높이와 너비를 지정할 수 있다<br>
        고정된 단위(px 등)의 크기로도 지정 가능하며 
        가변 크기 단위(%)의 크기로도 지정 가능하다
    </p>

    <h4>고정 크기 단위 : 화면 사이즈가 줄어도 크기가 변하지 않음</h4>
    <img src = "sample/image/flower1.PNG" width="200px" height = "150px">
    <img src = "sample/image/flower2.PNG" width="200px" height = "150px">
    <img src = "sample/image/flower3.PNG" width="200px" height = "150px">
    <img src = "sample/image/flower4.PNG" width="200px" height = "150px">
    <img src = "sample/image/flower5.PNG" width="200px" height = "150px">

    <hr>

5-4) 사진 사이즈 가변 크기 단위로 설정

 <h4>가변 크기 단위 : 화면 사이즈 혹은 기준 사이즈에 따라 크기가 변경</h4>
    <img src = "sample/image/flower1.PNG" width="15%" height = "150px">
    <img src = "sample/image/flower2.PNG" width="15%" height = "150px">
    <img src = "sample/image/flower3.PNG" width="15%" height = "150px">
    <img src = "sample/image/flower4.PNG" width="15%" height = "150px">
    <img src = "sample/image/flower5.PNG" width="15%" height = "150px">

    <hr>

5-5) 이미지 구역 두 곳에 링크 설정

 <h4>이미지 구역을 2개로 나누어 각각 링크 설정</h4>
    <pre>
        map, area : 이미지를 구역별로 나누어 링크를 걸어주는 태그
        -img 태그에 usemap 속성 지정
        -shape 링크로 사용할 영역의 형태 지정
        -coords : 분할할 지역 좌표 지정
        -href : 링크 주소 지정
        -target : 링크 페이지가 열릴 위치(새창, 현재창)
    </pre>
    <img src = "sample/image/tower1.PNG" usemap = "#map">
    <map name = "map">
        <area shape = "rect" coords = "00, 00, 300, 500" href = "https://www.naver.com" target = "_blank">
        <area shape = "circle" coords = "450, 250, 150" href = "https://www.google.com" target= "_self">
    </map>
</body>
</html>

 

6) 미디어 관련 태그

6-1) 오디오 관련 태그

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>06_미디어 관련 태그</title>
</head>
<body>
    <h1>미디어 관련 태그</h1>
    <h3>오디오 관련 태그</h3>
    <pre>
        -src : 경로
        -controls : 재생도구 출력 지정
        -loop : 반복 여부 지정(다시 처음으로 돌아오기)
    </pre>
    <audio src = "sample/audio/music.mp3" controls = "controls" loop = "loop"></audio>

    <hr>

6-2) 비디오 관련 태그

 <h3>비디오 관련 태그</h3>
    <pre>
        -src : 경로
        -controls : 재생도구 출력 지정 
        -poster : 재생 전 출력 이미지(썸네일)
    </pre>
    <video src = "sample/video/video.mp4" controls = "controls"
    poster = "sample/image/city1.PNG" loop = "loop"></video>
</body>
</html>

 

 

 

7) 하이퍼링크 관련 태그

7-1) 하이퍼 링크 관련 태그 기본

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>07_하이퍼링크 관련 태그</title>
</head>
<body>
    <h1>하이퍼링크 관련 태그</h1>    
    
    <h3>a 태그를 이용한 하이퍼링크 테스트</h3>
    <ul>
        <li><a href = "01_글자관련태그.html">글자 관련 태그</a></li>
        <li><a href = "02_목록관련태그.html">목록 관련 태그</a></li>
        <li><a href = "03_표관련태그.html">표 관련 태그</a></li>
        <li><a href = "04_영역관련태그.html">영역 관련 태그</a></li>
        <li><a href = "05_이미지관련태그.html">이미지 관련 태그</a></li>
    </ul>
    
    <h3>네트워크가 연결된 상황이라면 현재 서비스되고 있는 웹페이지도 링크 가능</h3>
    <ul>
        <li><a href = "https://www.naver.com" target = "_blank">네이버</a></li>
        <li><a href = "https://www.google.com" target = "_self">구글</a></li>
    </ul>

    <hr>

    <h3>이미지 태그를 이용한 링크</h3>
    <a href = "https://www.daum.net">
        <img src = "sample/image/forest1.PNG">
    </a>

7-2) 이미지 이용 링크

7-3) 본문으로 가는 링크, 메뉴로 돌아가기(여기 추가!!!!!!!!!!!!!)

 <h3 id = "menu">한 페이지 내에서 점프하는 링크</h3>
    <ul>
        <li><a href = "#content1">본문내용1</a></li>
        <li><a href = "#content2">본문내용2</a></li>
        <li><a href = "#content3">본문내용3</a></li>
    </ul>

    <h4 id = "content1">본문내용1</h4>
    <p>위에 경, 별빛이 우는 어머님, 불러 어머님, 별 듯합니다. 별에도 별 이름자를 나는 이런 강아지, 까닭입니다. 가을로 불러 마리아 벌써 쉬이 별을 있습니다. 가득 이런 노새, 봅니다. 걱정도 이름과, 우는 사랑과 헤일 봄이 차 이웃 까닭입니다. 써 너무나 별 위에도 별들을 말 봅니다. 까닭이요, 한 소녀들의 때 프랑시스 아스라히 된 노루, 그리워 있습니다. 다하지 이름과, 하나에 있습니다. 하나 그러나 별 마리아 추억과 부끄러운 있습니다. 둘 헤는 별 이름과, 계절이 마리아 하나에 까닭입니다.

        쉬이 새워 소녀들의 이름을 너무나 쓸쓸함과 경, 시인의 새겨지는 있습니다. 헤일 하나에 이름과, 추억과 하나에 별 아침이 봅니다. 걱정도 별 이름자를 이름을 불러 지나고 쉬이 봅니다. 토끼, 아직 파란 하나 이네들은 쓸쓸함과 다 책상을 시인의 까닭입니다. 가슴속에 노루, 파란 가을 듯합니다. 못 아침이 그리워 소학교 아이들의 나는 있습니다. 별 이름과, 노새, 밤이 위에 하나에 북간도에 버리었습니다. 다하지 위에 잠, 아침이 지나고 토끼, 듯합니다. 나는 걱정도 무덤 벌레는 별 이네들은 풀이 버리었습니다. 마리아 겨울이 노루, 오는 이름과 피어나듯이 못 밤을 프랑시스 있습니다.
        
        이런 멀리 이름을 노루, 가난한 별 걱정도 잔디가 있습니다. 나의 이름자를 아무 하나의 파란 벌레는 있습니다. 시와 그리고 라이너 패, 계십니다. 걱정도 무성할 내 파란 까닭입니다. 이름과, 까닭이요, 별 언덕 소녀들의 이국 별을 거외다. 사람들의 그리고 없이 이네들은 이국 하늘에는 이름과 덮어 내 봅니다. 가난한 내 추억과 벌레는 이름자를 그리고 자랑처럼 새워 있습니다. 헤일 별 걱정도 써 별이 이름자를 가을로 까닭이요, 계십니다. 그리고 못 했던 위에 가을로 새겨지는 것은 이름을 북간도에 봅니다. 밤이 별 이 별 못 봅니다.
        
        헤는 노새, 많은 소학교 계십니다. 패, 가을 위에 없이 듯합니다. 남은 하나에 이름을 까닭입니다. 비둘기, 봄이 당신은 덮어 속의 내린 시인의 강아지, 까닭입니다. 봄이 덮어 그러나 아름다운 오는 별 가을로 봅니다. 밤을 부끄러운 하나에 겨울이 경, 없이 시인의 있습니다. 노루, 벌써 가을 추억과 아직 어머니, 아이들의 자랑처럼 멀듯이, 거외다. 나는 아무 옥 라이너 계절이 이름자를 그리워 봅니다. 봄이 피어나듯이 흙으로 때 지나고 당신은 있습니다.
        
        어머님, 이름을 어머니 별빛이 북간도에 그리고 없이 된 멀리 있습니다. 보고, 이국 밤을 멀리 봅니다. 이름을 어머님, 쓸쓸함과 나의 아침이 별들을 소학교 별빛이 듯합니다. 그리고 나의 자랑처럼 된 시와 거외다. 아름다운 다 별이 나는 애기 많은 노새, 속의 봅니다. 프랑시스 가을로 아침이 어머님, 계절이 북간도에 언덕 봅니다. 새워 나는 묻힌 하나에 밤을 멀리 멀듯이, 있습니다. 그리고 청춘이 어머님, 하나에 패, 가슴속에 그리워 거외다. 이름자를 시와 남은 까닭입니다. 하나에 별 토끼, 것은 책상을 아무 다하지 그리고 까닭입니다.
        
        옥 아직 내린 까닭입니다. 강아지, 어머니 새겨지는 이름과, 둘 계십니다. 이런 별 시인의 이름을 별들을 언덕 하나에 별 지나고 듯합니다. 없이 까닭이요, 별을 헤일 아침이 봅니다. 너무나 언덕 하나의 노루, 이국 내 강아지, 있습니다. 한 멀리 가득 하나에 별 벌레는 계십니다. 하나에 딴은 한 까닭입니다. 아름다운 속의 내 이웃 별들을 않은 그리워 이름과, 경, 거외다. 다 우는 밤이 아침이 걱정도 경, 이름자를 딴은 별들을 있습니다. 하나에 별 오면 나는 보고, 책상을 버리었습니다.
        
        나는 둘 별이 이런 위에도 내 봅니다. 어머님, 불러 지나가는 별이 강아지, 까닭입니다. 잠, 아스라히 벌써 옥 마리아 어머니, 프랑시스 봄이 까닭입니다. 불러 아직 애기 릴케 오는 새겨지는 듯합니다. 이름과 별이 지나고 하늘에는 벌써 어머님, 패, 이웃 있습니다. 어머니, 아침이 무엇인지 어머님, 불러 내린 말 같이 하나에 있습니다. 내 보고, 가득 소녀들의 나의 이름을 토끼, 봅니다. 아직 별 이웃 이름과, 하나에 했던 봅니다. 이름과, 청춘이 애기 옥 하나에 헤일 이름과 까닭입니다. 소학교 오면 별빛이 자랑처럼 까닭이요, 사랑과 아스라히 내 봅니다.
        
        나는 위에 아직 오는 같이 겨울이 별 듯합니다. 경, 차 속의 하나에 멀리 나의 계십니다. 별이 청춘이 시인의 새겨지는 봅니다. 하나에 지나가는 써 계십니다. 슬퍼하는 언덕 계집애들의 위에도 별 하늘에는 봄이 듯합니다. 아스라히 가득 별 한 하나에 아무 듯합니다. 책상을 없이 했던 자랑처럼 거외다. 겨울이 때 무엇인지 그리고 그러나 이런 별빛이 까닭입니다. 이제 나는 당신은 토끼, 소녀들의 별에도 된 계십니다. 언덕 하나 멀듯이, 듯합니다.
        
        걱정도 풀이 패, 피어나듯이 릴케 있습니다. 이제 어머니 아이들의 당신은 별 책상을 흙으로 것은 별 있습니다. 오면 그리워 시와 노루, 어머니, 멀리 가을로 봅니다. 라이너 사랑과 멀리 이름자 새워 내일 말 가슴속에 잠, 까닭입니다. 가난한 까닭이요, 위에 별 듯합니다. 별 하나에 동경과 사랑과 언덕 봅니다. 헤일 당신은 못 이웃 다 무성할 지나고 프랑시스 까닭입니다. 추억과 흙으로 이름자를 가난한 같이 이런 불러 덮어 이름과, 듯합니다. 쉬이 가슴속에 어머니, 나의 봅니다. 새워 까닭이요, 나는 애기 내 딴은 새겨지는 어머님, 이런 계십니다.
        
        않은 우는 너무나 마리아 이국 쉬이 내 아이들의 듯합니다. 별 이국 내 덮어 파란 별 다 까닭입니다. 패, 어머님, 하나에 봅니다. 이름을 이름과, 가슴속에 있습니다. 위에 아직 별 내일 그러나 까닭입니다. 비둘기, 별 너무나 옥 하나에 못 별 릴케 까닭입니다. 가을 애기 아무 어머님, 풀이 잔디가 쓸쓸함과 봅니다. 없이 하늘에는 릴케 계십니다. 이국 한 때 가을 봅니다.
        
        너무나 무덤 부끄러운 써 없이 어머님, 하나의 소녀들의 나는 계십니다. 쉬이 별 위에 별 까닭이요, 거외다. 이국 별들을 별 추억과 쓸쓸함과 별이 이름자를 거외다. 내 별 패, 잔디가 가슴속에 별을 슬퍼하는 이웃 어머니, 까닭입니다. 별들을 당신은 별 것은 써 위에 사랑과 멀듯이, 계십니다. 별들을 말 딴은 새겨지는 거외다. 겨울이 가난한 이름과, 까닭이요, 계십니다. 이름과, 하나에 내 사랑과 듯합니다. 시인의 아무 까닭이요, 이제 가득 벌레는 않은 어머님, 까닭입니다. 어머님, 써 이네들은 계집애들의 남은 나의 헤는 오는 벌레는 버리었습니다.
        
        별 나는 별들을 때 듯합니다. 새워 이름을 밤이 당신은 벌써 까닭이요, 청춘이 위에도 파란 버리었습니다. 겨울이 오면 않은 사람들의 부끄러운 멀리 별이 노루, 있습니다. 쉬이 나는 계절이 헤일 부끄러운 다 계집애들의 봅니다. 밤이 소학교 것은 덮어 별을 노새, 봅니다. 이름과, 아침이 쉬이 소학교 당신은 별 봅니다. 흙으로 가슴속에 차 봅니다. 이름과, 못 가득 옥 많은 하나 별 까닭이요, 까닭입니다. 밤이 별 걱정도 했던 된 봅니다. 차 이름자 소학교 애기 위에도 걱정도 까닭입니다.
        
        무성할 나의 밤이 거외다. 어머니, 어머니, 언덕 하나에 불러 없이 내일 계절이 밤을 있습니다. 멀리 그리워 아이들의 위에 패, 내 토끼, 버리었습니다. 사랑과 나의 패, 벌레는 별 때 프랑시스 둘 거외다. 보고, 멀듯이, 별에도 밤이 다 청춘이 아무 있습니다. 했던 가을로 언덕 멀듯이, 패, 계십니다. 어머님, 별 마리아 봅니다. 무덤 토끼, 이름과, 그리고 별 어머니, 별들을 거외다. 슬퍼하는 어머님, 소녀들의 계십니다.
        
        가난한 위에도 묻힌 이국 내일 강아지, 까닭입니다. 풀이 별 것은 우는 동경과 벌써 노루, 남은 하늘에는 까닭입니다. 된 사람들의 책상을 나의 아침이 거외다. 릴케 추억과 오면 봄이 아이들의 나는 봅니다. 다 피어나듯이 무엇인지 나는 밤을 속의 없이 딴은 라이너 까닭입니다. 멀듯이, 가슴속에 가을로 다 헤는 헤일 아침이 부끄러운 까닭입니다. 하나에 무성할 된 까닭입니다. 책상을 별을 내 지나고 무엇인지 아름다운 오는 마리아 거외다. 것은 둘 나는 보고, 까닭입니다. 하나의 많은 추억과 벌써 피어나듯이 하나에 책상을 까닭입니다.
        
        경, 비둘기, 옥 애기 사랑과 까닭입니다. 토끼, 패, 다 하늘에는 별 것은 하나에 파란 봅니다. 가득 하나의 이제 봅니다. 멀리 사랑과 이 무덤 가난한 까닭입니다. 언덕 마디씩 이국 많은 언덕 있습니다. 둘 하나에 라이너 묻힌 아침이 보고, 어머니, 듯합니다. 차 가득 어머니, 별빛이 때 걱정도 이네들은 잔디가 거외다. 멀리 이국 오는 자랑처럼 별 하나에 내린 버리었습니다. 가난한 겨울이 사랑과 내린 있습니다. 애기 옥 슬퍼하는 별 내 하나에 불러 이름자 버리었습니다. 헤는 된 딴은 이국 옥 잔디가 듯합니다.
        
        밤을 패, 아침이 이름을 경, 듯합니다. 것은 가난한 덮어 이름과, 속의 무덤 너무나 파란 까닭입니다. 불러 마리아 계집애들의 이국 봄이 계십니다. 둘 내일 나는 언덕 소학교 별 버리었습니다. 이름자를 이름과, 아이들의 까닭입니다. 언덕 어머니, 파란 쉬이 아스라히 나의 까닭입니다. 멀리 차 슬퍼하는 쉬이 새겨지는 마디씩 나의 거외다. 동경과 하나의 추억과 마리아 한 아무 위에 까닭입니다. 이런 묻힌 이름자 있습니다. 무엇인지 시인의 무성할 언덕 강아지, 계십니다.
        
        지나고 별들을 별 아이들의 다 위에 듯합니다. 차 하늘에는 어머님, 이름과 별 쓸쓸함과 멀리 가을 써 있습니다. 노루, 까닭이요, 라이너 시인의 사랑과 별 새워 있습니다. 묻힌 어머니, 내 아침이 이네들은 자랑처럼 이름과, 까닭입니다. 이런 아름다운 멀리 이웃 벌레는 시인의 시와 동경과 까닭입니다. 별에도 시와 말 있습니다. 그러나 가득 청춘이 써 이름과, 내 어머님, 어머님, 쉬이 버리었습니다. 오면 가난한 한 계십니다. 멀리 멀듯이, 남은 이름을 가득 거외다. 무엇인지 같이 라이너 듯합니다. 패, 언덕 없이 아름다운 그러나 이웃 것은 있습니다.
        
        당신은 지나가는 피어나듯이 무성할 다 하나의 계십니다. 별이 하나 시인의 둘 그리고 계집애들의 비둘기, 파란 새워 버리었습니다. 멀듯이, 내 이름을 쓸쓸함과 된 위에도 있습니다. 이름을 남은 걱정도 라이너 지나가는 동경과 많은 지나고 까닭입니다. 사람들의 없이 말 시와 남은 불러 않은 까닭입니다. 청춘이 벌써 아스라히 있습니다. 많은 까닭이요, 벌써 내 이름을 소녀들의 경, 버리었습니다. 위에 지나가는 헤일 너무나 옥 아직 버리었습니다. 이름을 별 둘 북간도에 것은 어머님, 잔디가 별을 거외다.
        
        위에도 소학교 이국 이름과, 아이들의 내일 하나 봅니다. 내 이름을 속의 하늘에는 이런 까닭입니다. 이름을 그리고 노새, 내 풀이 잔디가 했던 시인의 소녀들의 듯합니다. 강아지, 책상을 나의 보고, 별 까닭이요, 소녀들의 까닭이요, 어머님, 있습니다. 풀이 이네들은 피어나듯이 가슴속에 내린 가을로 하나에 옥 헤일 버리었습니다. 별을 지나고 흙으로 밤을 이름자를 버리었습니다. 딴은 별들을 가슴속에 이름과, 별 내 이름과, 까닭입니다. 가을 다하지 너무나 애기 이웃 차 있습니다. 멀듯이, 이 밤을 너무나 이름과, 덮어 속의 까닭입니다. 잔디가 이름자 다하지 잠, 언덕 딴은 계십니다. 부끄러운 아무 언덕 자랑처럼 않은 패, 까닭입니다.
        
        우는 써 계절이 아스라히 까닭입니다. 사랑과 나는 많은 거외다. 가을 파란 별이 이국 새겨지는 새워 언덕 봅니다. 하나에 무엇인지 불러 말 어머님, 아침이 어머니, 나는 나는 까닭입니다. 마리아 사랑과 소녀들의 멀리 잔디가 까닭이요, 듯합니다. 노루, 어머니 부끄러운 이름자를 새워 있습니다. 나는 당신은 한 새워 가을 있습니다. 나는 릴케 가을로 멀리 위에도 없이 동경과 아름다운 다 거외다. 나는 이름자를 하나에 지나가는 이런 밤이 듯합니다. 노새, 헤일 멀리 아름다운 언덕 피어나듯이 별 경, 계십니다. 풀이 소학교 많은 같이 쉬이 사람들의 이름자를 비둘기, 듯합니다.</p>
    
    <br>
    <a href = "#menu">메뉴로 돌아가기</a>
    <br> 

        <h4 id = "content2">본문내용2</h4>
    <p>위에 경, 별빛이 우는 어머님, 불러 어머님, 별 듯합니다. 별에도 별 이름자를 나는 이런 강아지, 까닭입니다. 가을로 불러 마리아 벌써 쉬이 별을 있습니다. 가득 이런 노새, 봅니다. 걱정도 이름과, 우는 사랑과 헤일 봄이 차 이웃 까닭입니다. 써 너무나 별 위에도 별들을 말 봅니다. 까닭이요, 한 소녀들의 때 프랑시스 아스라히 된 노루, 그리워 있습니다. 다하지 이름과, 하나에 있습니다. 하나 그러나 별 마리아 추억과 부끄러운 있습니다. 둘 헤는 별 이름과, 계절이 마리아 하나에 까닭입니다.

        쉬이 새워 소녀들의 이름을 너무나 쓸쓸함과 경, 시인의 새겨지는 있습니다. 헤일 하나에 이름과, 추억과 하나에 별 아침이 봅니다. 걱정도 별 이름자를 이름을 불러 지나고 쉬이 봅니다. 토끼, 아직 파란 하나 이네들은 쓸쓸함과 다 책상을 시인의 까닭입니다. 가슴속에 노루, 파란 가을 듯합니다. 못 아침이 그리워 소학교 아이들의 나는 있습니다. 별 이름과, 노새, 밤이 위에 하나에 북간도에 버리었습니다. 다하지 위에 잠, 아침이 지나고 토끼, 듯합니다. 나는 걱정도 무덤 벌레는 별 이네들은 풀이 버리었습니다. 마리아 겨울이 노루, 오는 이름과 피어나듯이 못 밤을 프랑시스 있습니다.
        
        이런 멀리 이름을 노루, 가난한 별 걱정도 잔디가 있습니다. 나의 이름자를 아무 하나의 파란 벌레는 있습니다. 시와 그리고 라이너 패, 계십니다. 걱정도 무성할 내 파란 까닭입니다. 이름과, 까닭이요, 별 언덕 소녀들의 이국 별을 거외다. 사람들의 그리고 없이 이네들은 이국 하늘에는 이름과 덮어 내 봅니다. 가난한 내 추억과 벌레는 이름자를 그리고 자랑처럼 새워 있습니다. 헤일 별 걱정도 써 별이 이름자를 가을로 까닭이요, 계십니다. 그리고 못 했던 위에 가을로 새겨지는 것은 이름을 북간도에 봅니다. 밤이 별 이 별 못 봅니다.
        
        헤는 노새, 많은 소학교 계십니다. 패, 가을 위에 없이 듯합니다. 남은 하나에 이름을 까닭입니다. 비둘기, 봄이 당신은 덮어 속의 내린 시인의 강아지, 까닭입니다. 봄이 덮어 그러나 아름다운 오는 별 가을로 봅니다. 밤을 부끄러운 하나에 겨울이 경, 없이 시인의 있습니다. 노루, 벌써 가을 추억과 아직 어머니, 아이들의 자랑처럼 멀듯이, 거외다. 나는 아무 옥 라이너 계절이 이름자를 그리워 봅니다. 봄이 피어나듯이 흙으로 때 지나고 당신은 있습니다.
        
        어머님, 이름을 어머니 별빛이 북간도에 그리고 없이 된 멀리 있습니다. 보고, 이국 밤을 멀리 봅니다. 이름을 어머님, 쓸쓸함과 나의 아침이 별들을 소학교 별빛이 듯합니다. 그리고 나의 자랑처럼 된 시와 거외다. 아름다운 다 별이 나는 애기 많은 노새, 속의 봅니다. 프랑시스 가을로 아침이 어머님, 계절이 북간도에 언덕 봅니다. 새워 나는 묻힌 하나에 밤을 멀리 멀듯이, 있습니다. 그리고 청춘이 어머님, 하나에 패, 가슴속에 그리워 거외다. 이름자를 시와 남은 까닭입니다. 하나에 별 토끼, 것은 책상을 아무 다하지 그리고 까닭입니다.
        
        옥 아직 내린 까닭입니다. 강아지, 어머니 새겨지는 이름과, 둘 계십니다. 이런 별 시인의 이름을 별들을 언덕 하나에 별 지나고 듯합니다. 없이 까닭이요, 별을 헤일 아침이 봅니다. 너무나 언덕 하나의 노루, 이국 내 강아지, 있습니다. 한 멀리 가득 하나에 별 벌레는 계십니다. 하나에 딴은 한 까닭입니다. 아름다운 속의 내 이웃 별들을 않은 그리워 이름과, 경, 거외다. 다 우는 밤이 아침이 걱정도 경, 이름자를 딴은 별들을 있습니다. 하나에 별 오면 나는 보고, 책상을 버리었습니다.
        
        나는 둘 별이 이런 위에도 내 봅니다. 어머님, 불러 지나가는 별이 강아지, 까닭입니다. 잠, 아스라히 벌써 옥 마리아 어머니, 프랑시스 봄이 까닭입니다. 불러 아직 애기 릴케 오는 새겨지는 듯합니다. 이름과 별이 지나고 하늘에는 벌써 어머님, 패, 이웃 있습니다. 어머니, 아침이 무엇인지 어머님, 불러 내린 말 같이 하나에 있습니다. 내 보고, 가득 소녀들의 나의 이름을 토끼, 봅니다. 아직 별 이웃 이름과, 하나에 했던 봅니다. 이름과, 청춘이 애기 옥 하나에 헤일 이름과 까닭입니다. 소학교 오면 별빛이 자랑처럼 까닭이요, 사랑과 아스라히 내 봅니다.
        
        나는 위에 아직 오는 같이 겨울이 별 듯합니다. 경, 차 속의 하나에 멀리 나의 계십니다. 별이 청춘이 시인의 새겨지는 봅니다. 하나에 지나가는 써 계십니다. 슬퍼하는 언덕 계집애들의 위에도 별 하늘에는 봄이 듯합니다. 아스라히 가득 별 한 하나에 아무 듯합니다. 책상을 없이 했던 자랑처럼 거외다. 겨울이 때 무엇인지 그리고 그러나 이런 별빛이 까닭입니다. 이제 나는 당신은 토끼, 소녀들의 별에도 된 계십니다. 언덕 하나 멀듯이, 듯합니다.
        
        걱정도 풀이 패, 피어나듯이 릴케 있습니다. 이제 어머니 아이들의 당신은 별 책상을 흙으로 것은 별 있습니다. 오면 그리워 시와 노루, 어머니, 멀리 가을로 봅니다. 라이너 사랑과 멀리 이름자 새워 내일 말 가슴속에 잠, 까닭입니다. 가난한 까닭이요, 위에 별 듯합니다. 별 하나에 동경과 사랑과 언덕 봅니다. 헤일 당신은 못 이웃 다 무성할 지나고 프랑시스 까닭입니다. 추억과 흙으로 이름자를 가난한 같이 이런 불러 덮어 이름과, 듯합니다. 쉬이 가슴속에 어머니, 나의 봅니다. 새워 까닭이요, 나는 애기 내 딴은 새겨지는 어머님, 이런 계십니다.
        
        않은 우는 너무나 마리아 이국 쉬이 내 아이들의 듯합니다. 별 이국 내 덮어 파란 별 다 까닭입니다. 패, 어머님, 하나에 봅니다. 이름을 이름과, 가슴속에 있습니다. 위에 아직 별 내일 그러나 까닭입니다. 비둘기, 별 너무나 옥 하나에 못 별 릴케 까닭입니다. 가을 애기 아무 어머님, 풀이 잔디가 쓸쓸함과 봅니다. 없이 하늘에는 릴케 계십니다. 이국 한 때 가을 봅니다.
        
        너무나 무덤 부끄러운 써 없이 어머님, 하나의 소녀들의 나는 계십니다. 쉬이 별 위에 별 까닭이요, 거외다. 이국 별들을 별 추억과 쓸쓸함과 별이 이름자를 거외다. 내 별 패, 잔디가 가슴속에 별을 슬퍼하는 이웃 어머니, 까닭입니다. 별들을 당신은 별 것은 써 위에 사랑과 멀듯이, 계십니다. 별들을 말 딴은 새겨지는 거외다. 겨울이 가난한 이름과, 까닭이요, 계십니다. 이름과, 하나에 내 사랑과 듯합니다. 시인의 아무 까닭이요, 이제 가득 벌레는 않은 어머님, 까닭입니다. 어머님, 써 이네들은 계집애들의 남은 나의 헤는 오는 벌레는 버리었습니다.
        
        별 나는 별들을 때 듯합니다. 새워 이름을 밤이 당신은 벌써 까닭이요, 청춘이 위에도 파란 버리었습니다. 겨울이 오면 않은 사람들의 부끄러운 멀리 별이 노루, 있습니다. 쉬이 나는 계절이 헤일 부끄러운 다 계집애들의 봅니다. 밤이 소학교 것은 덮어 별을 노새, 봅니다. 이름과, 아침이 쉬이 소학교 당신은 별 봅니다. 흙으로 가슴속에 차 봅니다. 이름과, 못 가득 옥 많은 하나 별 까닭이요, 까닭입니다. 밤이 별 걱정도 했던 된 봅니다. 차 이름자 소학교 애기 위에도 걱정도 까닭입니다.
        
        무성할 나의 밤이 거외다. 어머니, 어머니, 언덕 하나에 불러 없이 내일 계절이 밤을 있습니다. 멀리 그리워 아이들의 위에 패, 내 토끼, 버리었습니다. 사랑과 나의 패, 벌레는 별 때 프랑시스 둘 거외다. 보고, 멀듯이, 별에도 밤이 다 청춘이 아무 있습니다. 했던 가을로 언덕 멀듯이, 패, 계십니다. 어머님, 별 마리아 봅니다. 무덤 토끼, 이름과, 그리고 별 어머니, 별들을 거외다. 슬퍼하는 어머님, 소녀들의 계십니다.
        
        가난한 위에도 묻힌 이국 내일 강아지, 까닭입니다. 풀이 별 것은 우는 동경과 벌써 노루, 남은 하늘에는 까닭입니다. 된 사람들의 책상을 나의 아침이 거외다. 릴케 추억과 오면 봄이 아이들의 나는 봅니다. 다 피어나듯이 무엇인지 나는 밤을 속의 없이 딴은 라이너 까닭입니다. 멀듯이, 가슴속에 가을로 다 헤는 헤일 아침이 부끄러운 까닭입니다. 하나에 무성할 된 까닭입니다. 책상을 별을 내 지나고 무엇인지 아름다운 오는 마리아 거외다. 것은 둘 나는 보고, 까닭입니다. 하나의 많은 추억과 벌써 피어나듯이 하나에 책상을 까닭입니다.
        
        경, 비둘기, 옥 애기 사랑과 까닭입니다. 토끼, 패, 다 하늘에는 별 것은 하나에 파란 봅니다. 가득 하나의 이제 봅니다. 멀리 사랑과 이 무덤 가난한 까닭입니다. 언덕 마디씩 이국 많은 언덕 있습니다. 둘 하나에 라이너 묻힌 아침이 보고, 어머니, 듯합니다. 차 가득 어머니, 별빛이 때 걱정도 이네들은 잔디가 거외다. 멀리 이국 오는 자랑처럼 별 하나에 내린 버리었습니다. 가난한 겨울이 사랑과 내린 있습니다. 애기 옥 슬퍼하는 별 내 하나에 불러 이름자 버리었습니다. 헤는 된 딴은 이국 옥 잔디가 듯합니다.
        
        밤을 패, 아침이 이름을 경, 듯합니다. 것은 가난한 덮어 이름과, 속의 무덤 너무나 파란 까닭입니다. 불러 마리아 계집애들의 이국 봄이 계십니다. 둘 내일 나는 언덕 소학교 별 버리었습니다. 이름자를 이름과, 아이들의 까닭입니다. 언덕 어머니, 파란 쉬이 아스라히 나의 까닭입니다. 멀리 차 슬퍼하는 쉬이 새겨지는 마디씩 나의 거외다. 동경과 하나의 추억과 마리아 한 아무 위에 까닭입니다. 이런 묻힌 이름자 있습니다. 무엇인지 시인의 무성할 언덕 강아지, 계십니다.
        
        지나고 별들을 별 아이들의 다 위에 듯합니다. 차 하늘에는 어머님, 이름과 별 쓸쓸함과 멀리 가을 써 있습니다. 노루, 까닭이요, 라이너 시인의 사랑과 별 새워 있습니다. 묻힌 어머니, 내 아침이 이네들은 자랑처럼 이름과, 까닭입니다. 이런 아름다운 멀리 이웃 벌레는 시인의 시와 동경과 까닭입니다. 별에도 시와 말 있습니다. 그러나 가득 청춘이 써 이름과, 내 어머님, 어머님, 쉬이 버리었습니다. 오면 가난한 한 계십니다. 멀리 멀듯이, 남은 이름을 가득 거외다. 무엇인지 같이 라이너 듯합니다. 패, 언덕 없이 아름다운 그러나 이웃 것은 있습니다.
        
        당신은 지나가는 피어나듯이 무성할 다 하나의 계십니다. 별이 하나 시인의 둘 그리고 계집애들의 비둘기, 파란 새워 버리었습니다. 멀듯이, 내 이름을 쓸쓸함과 된 위에도 있습니다. 이름을 남은 걱정도 라이너 지나가는 동경과 많은 지나고 까닭입니다. 사람들의 없이 말 시와 남은 불러 않은 까닭입니다. 청춘이 벌써 아스라히 있습니다. 많은 까닭이요, 벌써 내 이름을 소녀들의 경, 버리었습니다. 위에 지나가는 헤일 너무나 옥 아직 버리었습니다. 이름을 별 둘 북간도에 것은 어머님, 잔디가 별을 거외다.
        
        위에도 소학교 이국 이름과, 아이들의 내일 하나 봅니다. 내 이름을 속의 하늘에는 이런 까닭입니다. 이름을 그리고 노새, 내 풀이 잔디가 했던 시인의 소녀들의 듯합니다. 강아지, 책상을 나의 보고, 별 까닭이요, 소녀들의 까닭이요, 어머님, 있습니다. 풀이 이네들은 피어나듯이 가슴속에 내린 가을로 하나에 옥 헤일 버리었습니다. 별을 지나고 흙으로 밤을 이름자를 버리었습니다. 딴은 별들을 가슴속에 이름과, 별 내 이름과, 까닭입니다. 가을 다하지 너무나 애기 이웃 차 있습니다. 멀듯이, 이 밤을 너무나 이름과, 덮어 속의 까닭입니다. 잔디가 이름자 다하지 잠, 언덕 딴은 계십니다. 부끄러운 아무 언덕 자랑처럼 않은 패, 까닭입니다.
        
        우는 써 계절이 아스라히 까닭입니다. 사랑과 나는 많은 거외다. 가을 파란 별이 이국 새겨지는 새워 언덕 봅니다. 하나에 무엇인지 불러 말 어머님, 아침이 어머니, 나는 나는 까닭입니다. 마리아 사랑과 소녀들의 멀리 잔디가 까닭이요, 듯합니다. 노루, 어머니 부끄러운 이름자를 새워 있습니다. 나는 당신은 한 새워 가을 있습니다. 나는 릴케 가을로 멀리 위에도 없이 동경과 아름다운 다 거외다. 나는 이름자를 하나에 지나가는 이런 밤이 듯합니다. 노새, 헤일 멀리 아름다운 언덕 피어나듯이 별 경, 계십니다. 풀이 소학교 많은 같이 쉬이 사람들의 이름자를 비둘기, 듯합니다.</p>
    
        <br>
        <a href = "#menu">메뉴로 돌아가기</a>
        <br> 
    
        <h4 id = "content3">본문내용3</h4>
    <p>위에 경, 별빛이 우는 어머님, 불러 어머님, 별 듯합니다. 별에도 별 이름자를 나는 이런 강아지, 까닭입니다. 가을로 불러 마리아 벌써 쉬이 별을 있습니다. 가득 이런 노새, 봅니다. 걱정도 이름과, 우는 사랑과 헤일 봄이 차 이웃 까닭입니다. 써 너무나 별 위에도 별들을 말 봅니다. 까닭이요, 한 소녀들의 때 프랑시스 아스라히 된 노루, 그리워 있습니다. 다하지 이름과, 하나에 있습니다. 하나 그러나 별 마리아 추억과 부끄러운 있습니다. 둘 헤는 별 이름과, 계절이 마리아 하나에 까닭입니다.

        쉬이 새워 소녀들의 이름을 너무나 쓸쓸함과 경, 시인의 새겨지는 있습니다. 헤일 하나에 이름과, 추억과 하나에 별 아침이 봅니다. 걱정도 별 이름자를 이름을 불러 지나고 쉬이 봅니다. 토끼, 아직 파란 하나 이네들은 쓸쓸함과 다 책상을 시인의 까닭입니다. 가슴속에 노루, 파란 가을 듯합니다. 못 아침이 그리워 소학교 아이들의 나는 있습니다. 별 이름과, 노새, 밤이 위에 하나에 북간도에 버리었습니다. 다하지 위에 잠, 아침이 지나고 토끼, 듯합니다. 나는 걱정도 무덤 벌레는 별 이네들은 풀이 버리었습니다. 마리아 겨울이 노루, 오는 이름과 피어나듯이 못 밤을 프랑시스 있습니다.
        
        이런 멀리 이름을 노루, 가난한 별 걱정도 잔디가 있습니다. 나의 이름자를 아무 하나의 파란 벌레는 있습니다. 시와 그리고 라이너 패, 계십니다. 걱정도 무성할 내 파란 까닭입니다. 이름과, 까닭이요, 별 언덕 소녀들의 이국 별을 거외다. 사람들의 그리고 없이 이네들은 이국 하늘에는 이름과 덮어 내 봅니다. 가난한 내 추억과 벌레는 이름자를 그리고 자랑처럼 새워 있습니다. 헤일 별 걱정도 써 별이 이름자를 가을로 까닭이요, 계십니다. 그리고 못 했던 위에 가을로 새겨지는 것은 이름을 북간도에 봅니다. 밤이 별 이 별 못 봅니다.
        
        헤는 노새, 많은 소학교 계십니다. 패, 가을 위에 없이 듯합니다. 남은 하나에 이름을 까닭입니다. 비둘기, 봄이 당신은 덮어 속의 내린 시인의 강아지, 까닭입니다. 봄이 덮어 그러나 아름다운 오는 별 가을로 봅니다. 밤을 부끄러운 하나에 겨울이 경, 없이 시인의 있습니다. 노루, 벌써 가을 추억과 아직 어머니, 아이들의 자랑처럼 멀듯이, 거외다. 나는 아무 옥 라이너 계절이 이름자를 그리워 봅니다. 봄이 피어나듯이 흙으로 때 지나고 당신은 있습니다.
        
        어머님, 이름을 어머니 별빛이 북간도에 그리고 없이 된 멀리 있습니다. 보고, 이국 밤을 멀리 봅니다. 이름을 어머님, 쓸쓸함과 나의 아침이 별들을 소학교 별빛이 듯합니다. 그리고 나의 자랑처럼 된 시와 거외다. 아름다운 다 별이 나는 애기 많은 노새, 속의 봅니다. 프랑시스 가을로 아침이 어머님, 계절이 북간도에 언덕 봅니다. 새워 나는 묻힌 하나에 밤을 멀리 멀듯이, 있습니다. 그리고 청춘이 어머님, 하나에 패, 가슴속에 그리워 거외다. 이름자를 시와 남은 까닭입니다. 하나에 별 토끼, 것은 책상을 아무 다하지 그리고 까닭입니다.
        
        옥 아직 내린 까닭입니다. 강아지, 어머니 새겨지는 이름과, 둘 계십니다. 이런 별 시인의 이름을 별들을 언덕 하나에 별 지나고 듯합니다. 없이 까닭이요, 별을 헤일 아침이 봅니다. 너무나 언덕 하나의 노루, 이국 내 강아지, 있습니다. 한 멀리 가득 하나에 별 벌레는 계십니다. 하나에 딴은 한 까닭입니다. 아름다운 속의 내 이웃 별들을 않은 그리워 이름과, 경, 거외다. 다 우는 밤이 아침이 걱정도 경, 이름자를 딴은 별들을 있습니다. 하나에 별 오면 나는 보고, 책상을 버리었습니다.
        
        나는 둘 별이 이런 위에도 내 봅니다. 어머님, 불러 지나가는 별이 강아지, 까닭입니다. 잠, 아스라히 벌써 옥 마리아 어머니, 프랑시스 봄이 까닭입니다. 불러 아직 애기 릴케 오는 새겨지는 듯합니다. 이름과 별이 지나고 하늘에는 벌써 어머님, 패, 이웃 있습니다. 어머니, 아침이 무엇인지 어머님, 불러 내린 말 같이 하나에 있습니다. 내 보고, 가득 소녀들의 나의 이름을 토끼, 봅니다. 아직 별 이웃 이름과, 하나에 했던 봅니다. 이름과, 청춘이 애기 옥 하나에 헤일 이름과 까닭입니다. 소학교 오면 별빛이 자랑처럼 까닭이요, 사랑과 아스라히 내 봅니다.
        
        나는 위에 아직 오는 같이 겨울이 별 듯합니다. 경, 차 속의 하나에 멀리 나의 계십니다. 별이 청춘이 시인의 새겨지는 봅니다. 하나에 지나가는 써 계십니다. 슬퍼하는 언덕 계집애들의 위에도 별 하늘에는 봄이 듯합니다. 아스라히 가득 별 한 하나에 아무 듯합니다. 책상을 없이 했던 자랑처럼 거외다. 겨울이 때 무엇인지 그리고 그러나 이런 별빛이 까닭입니다. 이제 나는 당신은 토끼, 소녀들의 별에도 된 계십니다. 언덕 하나 멀듯이, 듯합니다.
        
        걱정도 풀이 패, 피어나듯이 릴케 있습니다. 이제 어머니 아이들의 당신은 별 책상을 흙으로 것은 별 있습니다. 오면 그리워 시와 노루, 어머니, 멀리 가을로 봅니다. 라이너 사랑과 멀리 이름자 새워 내일 말 가슴속에 잠, 까닭입니다. 가난한 까닭이요, 위에 별 듯합니다. 별 하나에 동경과 사랑과 언덕 봅니다. 헤일 당신은 못 이웃 다 무성할 지나고 프랑시스 까닭입니다. 추억과 흙으로 이름자를 가난한 같이 이런 불러 덮어 이름과, 듯합니다. 쉬이 가슴속에 어머니, 나의 봅니다. 새워 까닭이요, 나는 애기 내 딴은 새겨지는 어머님, 이런 계십니다.
        
        않은 우는 너무나 마리아 이국 쉬이 내 아이들의 듯합니다. 별 이국 내 덮어 파란 별 다 까닭입니다. 패, 어머님, 하나에 봅니다. 이름을 이름과, 가슴속에 있습니다. 위에 아직 별 내일 그러나 까닭입니다. 비둘기, 별 너무나 옥 하나에 못 별 릴케 까닭입니다. 가을 애기 아무 어머님, 풀이 잔디가 쓸쓸함과 봅니다. 없이 하늘에는 릴케 계십니다. 이국 한 때 가을 봅니다.
        
        너무나 무덤 부끄러운 써 없이 어머님, 하나의 소녀들의 나는 계십니다. 쉬이 별 위에 별 까닭이요, 거외다. 이국 별들을 별 추억과 쓸쓸함과 별이 이름자를 거외다. 내 별 패, 잔디가 가슴속에 별을 슬퍼하는 이웃 어머니, 까닭입니다. 별들을 당신은 별 것은 써 위에 사랑과 멀듯이, 계십니다. 별들을 말 딴은 새겨지는 거외다. 겨울이 가난한 이름과, 까닭이요, 계십니다. 이름과, 하나에 내 사랑과 듯합니다. 시인의 아무 까닭이요, 이제 가득 벌레는 않은 어머님, 까닭입니다. 어머님, 써 이네들은 계집애들의 남은 나의 헤는 오는 벌레는 버리었습니다.
        
        별 나는 별들을 때 듯합니다. 새워 이름을 밤이 당신은 벌써 까닭이요, 청춘이 위에도 파란 버리었습니다. 겨울이 오면 않은 사람들의 부끄러운 멀리 별이 노루, 있습니다. 쉬이 나는 계절이 헤일 부끄러운 다 계집애들의 봅니다. 밤이 소학교 것은 덮어 별을 노새, 봅니다. 이름과, 아침이 쉬이 소학교 당신은 별 봅니다. 흙으로 가슴속에 차 봅니다. 이름과, 못 가득 옥 많은 하나 별 까닭이요, 까닭입니다. 밤이 별 걱정도 했던 된 봅니다. 차 이름자 소학교 애기 위에도 걱정도 까닭입니다.
        
        무성할 나의 밤이 거외다. 어머니, 어머니, 언덕 하나에 불러 없이 내일 계절이 밤을 있습니다. 멀리 그리워 아이들의 위에 패, 내 토끼, 버리었습니다. 사랑과 나의 패, 벌레는 별 때 프랑시스 둘 거외다. 보고, 멀듯이, 별에도 밤이 다 청춘이 아무 있습니다. 했던 가을로 언덕 멀듯이, 패, 계십니다. 어머님, 별 마리아 봅니다. 무덤 토끼, 이름과, 그리고 별 어머니, 별들을 거외다. 슬퍼하는 어머님, 소녀들의 계십니다.
        
        가난한 위에도 묻힌 이국 내일 강아지, 까닭입니다. 풀이 별 것은 우는 동경과 벌써 노루, 남은 하늘에는 까닭입니다. 된 사람들의 책상을 나의 아침이 거외다. 릴케 추억과 오면 봄이 아이들의 나는 봅니다. 다 피어나듯이 무엇인지 나는 밤을 속의 없이 딴은 라이너 까닭입니다. 멀듯이, 가슴속에 가을로 다 헤는 헤일 아침이 부끄러운 까닭입니다. 하나에 무성할 된 까닭입니다. 책상을 별을 내 지나고 무엇인지 아름다운 오는 마리아 거외다. 것은 둘 나는 보고, 까닭입니다. 하나의 많은 추억과 벌써 피어나듯이 하나에 책상을 까닭입니다.
        
        경, 비둘기, 옥 애기 사랑과 까닭입니다. 토끼, 패, 다 하늘에는 별 것은 하나에 파란 봅니다. 가득 하나의 이제 봅니다. 멀리 사랑과 이 무덤 가난한 까닭입니다. 언덕 마디씩 이국 많은 언덕 있습니다. 둘 하나에 라이너 묻힌 아침이 보고, 어머니, 듯합니다. 차 가득 어머니, 별빛이 때 걱정도 이네들은 잔디가 거외다. 멀리 이국 오는 자랑처럼 별 하나에 내린 버리었습니다. 가난한 겨울이 사랑과 내린 있습니다. 애기 옥 슬퍼하는 별 내 하나에 불러 이름자 버리었습니다. 헤는 된 딴은 이국 옥 잔디가 듯합니다.
        
        밤을 패, 아침이 이름을 경, 듯합니다. 것은 가난한 덮어 이름과, 속의 무덤 너무나 파란 까닭입니다. 불러 마리아 계집애들의 이국 봄이 계십니다. 둘 내일 나는 언덕 소학교 별 버리었습니다. 이름자를 이름과, 아이들의 까닭입니다. 언덕 어머니, 파란 쉬이 아스라히 나의 까닭입니다. 멀리 차 슬퍼하는 쉬이 새겨지는 마디씩 나의 거외다. 동경과 하나의 추억과 마리아 한 아무 위에 까닭입니다. 이런 묻힌 이름자 있습니다. 무엇인지 시인의 무성할 언덕 강아지, 계십니다.
        
        지나고 별들을 별 아이들의 다 위에 듯합니다. 차 하늘에는 어머님, 이름과 별 쓸쓸함과 멀리 가을 써 있습니다. 노루, 까닭이요, 라이너 시인의 사랑과 별 새워 있습니다. 묻힌 어머니, 내 아침이 이네들은 자랑처럼 이름과, 까닭입니다. 이런 아름다운 멀리 이웃 벌레는 시인의 시와 동경과 까닭입니다. 별에도 시와 말 있습니다. 그러나 가득 청춘이 써 이름과, 내 어머님, 어머님, 쉬이 버리었습니다. 오면 가난한 한 계십니다. 멀리 멀듯이, 남은 이름을 가득 거외다. 무엇인지 같이 라이너 듯합니다. 패, 언덕 없이 아름다운 그러나 이웃 것은 있습니다.
        
        당신은 지나가는 피어나듯이 무성할 다 하나의 계십니다. 별이 하나 시인의 둘 그리고 계집애들의 비둘기, 파란 새워 버리었습니다. 멀듯이, 내 이름을 쓸쓸함과 된 위에도 있습니다. 이름을 남은 걱정도 라이너 지나가는 동경과 많은 지나고 까닭입니다. 사람들의 없이 말 시와 남은 불러 않은 까닭입니다. 청춘이 벌써 아스라히 있습니다. 많은 까닭이요, 벌써 내 이름을 소녀들의 경, 버리었습니다. 위에 지나가는 헤일 너무나 옥 아직 버리었습니다. 이름을 별 둘 북간도에 것은 어머님, 잔디가 별을 거외다.
        
        위에도 소학교 이국 이름과, 아이들의 내일 하나 봅니다. 내 이름을 속의 하늘에는 이런 까닭입니다. 이름을 그리고 노새, 내 풀이 잔디가 했던 시인의 소녀들의 듯합니다. 강아지, 책상을 나의 보고, 별 까닭이요, 소녀들의 까닭이요, 어머님, 있습니다. 풀이 이네들은 피어나듯이 가슴속에 내린 가을로 하나에 옥 헤일 버리었습니다. 별을 지나고 흙으로 밤을 이름자를 버리었습니다. 딴은 별들을 가슴속에 이름과, 별 내 이름과, 까닭입니다. 가을 다하지 너무나 애기 이웃 차 있습니다. 멀듯이, 이 밤을 너무나 이름과, 덮어 속의 까닭입니다. 잔디가 이름자 다하지 잠, 언덕 딴은 계십니다. 부끄러운 아무 언덕 자랑처럼 않은 패, 까닭입니다.
        
        우는 써 계절이 아스라히 까닭입니다. 사랑과 나는 많은 거외다. 가을 파란 별이 이국 새겨지는 새워 언덕 봅니다. 하나에 무엇인지 불러 말 어머님, 아침이 어머니, 나는 나는 까닭입니다. 마리아 사랑과 소녀들의 멀리 잔디가 까닭이요, 듯합니다. 노루, 어머니 부끄러운 이름자를 새워 있습니다. 나는 당신은 한 새워 가을 있습니다. 나는 릴케 가을로 멀리 위에도 없이 동경과 아름다운 다 거외다. 나는 이름자를 하나에 지나가는 이런 밤이 듯합니다. 노새, 헤일 멀리 아름다운 언덕 피어나듯이 별 경, 계십니다. 풀이 소학교 많은 같이 쉬이 사람들의 이름자를 비둘기, 듯합니다.</p>

        <br>
        <a href = "#menu">메뉴로 돌아가기</a>
        <br> 
</body>
</html>

8) 폼 관련 태그

8-1) 폼 관련 태그 기본

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>08_폼 관련 태그</title>
</head>
<body>
    <h1>폼 관련 태그</h1>
    <p>
        form 태그는 html에서 사용자가 입력할 수 있는 양식을 제공하는 태그<br>
        form 태그 내의 input 태그들을 통해 사용자가 입력한 정보로 서버를 넘기는 역할을 함
    </p>
    

    <hr>

    <form method = "post">
        <label for = "search">검색할 내용</label>
        <input type = "text" size = "20" name = "search" id = "search">
        <input type = "submit" value = "검색">
    </form>

    <p>
        submit 버튼을 눌렀을 때 action에 지정된 경로로 method에 지정한 방식으로
        input 태그의 값을 전달함<br>
        *action : 폼 내부에 입력된 사용자 입력 양식의 값을 전송받을 서버의 주소 입력<br>
        *method : get/post 방식으로 전송 방식 지정<br>
        설정하지 않았을 경우 get방식으로 지정(url 창으로 데이터를 보내는 방식)<br>
        post 방식으로 지정하면 url 창에 데이터가 보이지 않음
    </p>

    <hr>

 

8-2) 폼 그룹으로 묶는 태그

 <h3>fieldset : 폼 요소를 그룹으로 묶는 태그</h3>
    <h3>legend : 묶은 폼 요소에 명칭을 붙이는 태그</h3>

    <form>
        <fieldset>
            <legend>필드 셋의 제목을 작성하는 부분</legend>
            <label for = "input1">입력 1: </label><input type = "text" id = "input1"><br>
            <label for = "input2">입력 2: </label><input type = "text" id = "input2"><br>
            <label for = "input3">입력 3: </label><input type = "text" id = "input3"><br>
        </fieldset>
        <fieldset>
            <legend>필드 셋의 제목을 작성하는 부분</legend>
            <label for = "input4">입력 4: </label><input type = "text" id = "input4"><br>
            <label for = "input5">입력 5: </label><input type = "text" id = "input5"><br>
            <label for = "input6">입력 6: </label><input type = "text" id = "input6"><br>
        </fieldset>
    </form>

    <hr>

8-3) text와 관련된 input 태그

 <h2>text와 관련된 input태그</h2>
    <form method = "GET">
        <h3>type = "text"</h3>
        <p>
            -한 줄 짜리 텍스트를 입력할 수 있는 텍스트 상자
        </p>
        <label>아이디 : </label>
        <input type = "text" name = "userid" size = "20" placeholder = "아이디를 입력하세요"
        maxlength = "15" value = "khacademy" required>
        
        <h3>type = "password"</h3>
        <p>
            -비밀 번호를 입력할 수 있는 텍스트 상자
        </p>
        <label>비밀번호</label>
        <input type = "password" name = "userpwd" size = "20"
        placeholder=" 비밀번호를 입력하세요" maxlength="15" required>

        <input type = "submit" value = "로그인">

        <h3>type = "search", type = "url", type = "email", type = "tel"</h3>
        <p>
            -겉모습은 텍스트 필드와 비슷하지만 각각의 정보에 맞게 분화된 기능을 제공하는 텍스트 상자
        </p>
        <label>검색 : </label>
        <input type = "search" name = "searchtext" placeholder = "검색할 내용 입력">
        <br>
        <label>홈페이지</label>
        <input type = "url" name = "homepage" value = "https://">
        <br>
        <label>이메일 : </label>
        <input type = "email" name = "email" placeholder = "이메일을 입력하세요">
        <br>
        <label>전화번호 : </label>
        <input type = "tel" name = "phone" placeholder = "전화번호를 입력하세요">
        <br>
        <input type = "reset" value = "다시 입력">

        <input type = "submit" value = "전송">

    </form>

    <hr>

8-4) 숫자와 관련된 input 태그

 <h2>숫자와 관련된 input 태그</h2>
    <form method = "get">
        <h3>type = "number"</h3>
        <p>
            입력 창에 숫자를 입력하는 것이 기본이지만,
            브라우저에 따라 스핀 박스가 표시되기도 함
        </p>
        <label>수량 : </label>
        <input type = "number" name = "amount"
        min = "0" max = "100" value = "0" step ="5"><br>


        <h3>type = "range"</h3>
        <p>
            슬라이드바를 통해 숫자 지정 가능
        </p>
        <input type = "range" name = "point"
        min = "0" max = "100" value = "50" step = "10"><br>

    </form>

    <hr>

8-5) 날짜/시간과 관련된 input 태그

 <h2>날짜/시간과 관련된 input 태그</h2>
    <form method = "GET">
        <h3>type = "date/month/week/time/datetime-local"</h3>
        <label>date</label>
        <input type = "date" name = "dateIn">
        <label>month</label>
        <input type = "month" name = "monthIn">
        <label>week</label>
        <input type = "week" name = "weekIn">
        <label>time</label>
        <input type = "time" name = "timeIn">
        <label>datetime-local</label>
        <input type = "datetime-local" name = "dtlIn">

    </form>

    <hr>

8-6) 라디오 버튼과 체크박스

 <h2>라디오 버튼과 체크박스</h2>
    <p>
        태그를 여러 개 선언하여 하나의 용도로 사용할 경우 name 속성의 값이 같아야 함
    </p>
    <form>
        <h3>type = "radio"</h3>
        <label>성별 : </label>
        <input type = "radio" id = "male" name = "gender" value = "M">
        <label for = "male">남자</label>&nbsp;
        <input type = "radio" id = "female" name = "gender" value = "F" checked>
        <label for = "female">여자</label> 


        <h3>type = "checkbox"</h3>
        <label>취미</label>
        <input type = "checkbox" id = "baseball" name="hobby" value="baseball">
        <label for ="baseball">야구</label> &nbsp;
        <input type = "checkbox" id = "basketball" name="hobby" value="basketball">
        <label for ="basketball">농구</label> &nbsp;
        <input type = "checkbox" id = "football" name="hobby" value="football" checked>
        <label for ="football">축구</label> &nbsp;


        <input type = "submit">
        <input type = "reset">
    </form>

    <h3>추가 input 태그</h3>
    <form>
        <h3>type = "color"</h3>
        <label>색상 선택 : </label>
        <input type = "color" name = "color">

        <h3>type = "file"</h3>
        <label>파일 선택 : </label>
        <input type = "file" name = "uploadfile">

        <h3>type = "hidden"</h3>
        <label>안 보임 : </label>
        <input type = "hidden" name = "hiddenvalue" value = "1">
        <!--특정 값을 화면에 노출시키지 않고 서버에 전송하고 싶을 때 사용-->


        <h3>type = "button", type = "submit", type = "reset"</h3>
        <input type = "button" value = "button">&nbsp;
        <input type = "submit" value = "submit">&nbsp;
        <input type = "reset" value = "reset">


        <!--button 태그를 사용해서 버튼 만들기-->
        <button type = "button">button</button>&nbsp;
        <button type = "submit">submit</button>&nbsp;
        <button type = "reset">reset</button>
    </form>
    
        <hr>

8-7) select태그와 option태그

 <h2>select태그와 option태그</h2>
    <p>
        사용자가 직접 내용을 입력하는 것이 아니고
        여러 옵션 중에서 선택하게 하고 싶을 때 사용하는 드롭다운 목록
    </p>

    <form method = "get">
        <label>국적 : </label>
        <select name = "nationality">
            <option value = "ko" selected>한국</option>
            <option value = "ch">중국</option>
            <option value = "jp">일본</option>
            <option value = "etc">기타</option>
        </select>
        <input type = "submit">
    </form>

    <hr>

8-8) textarea태그

 <h2>textarea 태그</h2>
    <p> 
        input type = "text"와 비슷하지만 여러 줄을 입력할 수 있다
    </p>
    <form>
        <textarea cols = "50" rows = "10" style="resize: none;" name="content">
            textarea 내부의 값 작성하기~
        </textarea>
        <input type = "submit">
    </form>


    <br><br><br><br><br><br><br><br><br><br><br><br><br>
   
</body>
</html>