EMO-SSAGE.html 2.49 KB
<!DOCTYPE html>
<html lang="ko">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
  <title>EMOJI-HUMAN</title>
  <link rel="stylesheet" href="/index.css">
  <link rel="icon" type="image/x-icon" href="/src/rainbow_1f308.png">
  <style>
    body {
      background-image: url("emossage-03.png");
      background-repeat: no-repeat;
      background-size: 100%;
      font-family: Noto Sans KR, regular;
      text-align: center;
    }

    h1 {
      font-size: 50px;
    }

    p1 {
      font-size: 24px;
    }

    p2 {
      font-size: 14px
    }

    p2.small {
      line-height: 0.7;
    }
  </style>
  <div style="height: 100px; overflow: auto">
  </div>


</head>

<body>
  <form action="#">

    <header>
      <h1>Message + EMOJI<span>= Emossage</span></h1>
      <p1>Emoti는 이모지 중심 메세지입니다</p1>
      <br>
      <p2>
        <p class="small"> 글자 중 일부가 이모지로 변환됩니다.<br>
          여러분만의 이모지 편지를 적어보세요<br>
      </p2>
      </p>
    </header>

    <div>
      <label class="desc" id="title1" for="Field1">Full Name</label>
      <div>
        <input id="Field1" name="Field1" type="text" class="field text fn" value="" size="8" tabindex="1">
      </div>
    </div>

    <div>
      <label class="desc" id="title3" for="Field3">
        Email
      </label>
      <div>
        <input id="Field3" name="Field3" type="email" spellcheck="false" value="" maxlength="255" tabindex="3">
      </div>
    </div>

    <div>
      <label class="desc" id="title4" for="Field4">
        Message
      </label>

      <div>
        <textarea id="input" class="h-350" name="text_1" spellcheck="true" rows="10" cols="50" tabindex="4" placeholder="이모지로 변환할 문장을 입력해주세요"></textarea>
      </div>

      <div>
        <div id="checkPlag" class="btn" onclick="updateOutput()" style="margin: 0 auto;display: block;margin-top: 10px;cursor:pointer; box-sizing:border-box;width:250px">Generate</div>
      </div>
    </div>

    <div>
      <label class="result" id="title5" for="Field5">
        Emo-ssage
      </label>

      <div>
        <div id="output" class="h=350" name="text_2" style="font-family: Arial, Helvetica, sans-serif; overflow-y: auto;max-height: 350px;"></p>
      </div>
    </div>
    <script src="/EMO-SSAGE/emossage.js"/>

  </form>



</body>