4)로그인창만들기

STUDY (My Job)/TIL

4)로그인창만들기

태태. 2022. 12. 5. 01:43

728x90

만들어야 하는 것

1차완성

🔴HTML

  <body>
    <div class="container">
      <div>
        아이디<br /><input type="text" placeholder="아이디를 입력하세요" />
      </div>
      <div>
        비밀번호<br /><input
          type="password"
          placeholder="비밀번호를 입력하세요"
        />
      </div>
      <div>
        이메일<br /><input type="email" placeholder="이메일을 입력하세요" />
      </div>
      <div>생일<br /><input type="date" placeholder="생일을 입력하세요" /></div>

      <button type="button" onclick="alert('안녕하세요')">Button</button>
    </div>
  </body>

🔵CSS

* {
  padding: 0;
  margin: 0;
}

.container {
  width: 100px;
  height: 100px;
  border: 1px solid black;
  display: inline;
}

.container > div {
  position: relative;
}

개선되어야 할 점

✨ 중앙정렬 추가하기

728x90