걷기 시작한 Coding Novice

Html

로그인 페이지 만들기

Spell 2022. 5. 4. 20:58

위의 이미지대로 한번 만들어 보자.

 

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Login Page</title>
</head>
<body>
    <h1>로그인 페이지</h1>
    <p>ID: <input type="text"</p>
    <p>PW: <input type="text"</p>
    <p><button>로그인하기</button></p>
</body>
</html>

<h1></h1> 태그를 사용해서 로그인 페이지 헤드라인을 적고

<p></p> 태그를 사용해서 문단과 줄을 나누고

<input type="text"/>를 중간에 넣어 네모난 입력 창을 만들었다.

마지막으로 <button></button> 태그를 사용해서 박스를 만들고 '로그인하기'라는 글자를 넣었다.

그래서 나온 결과물은 아래와 같다.

짜잔! 똑같이? 비슷하게? 만들어졌다.

 

 


 

'Html' 카테고리의 다른 글

쇼핑몰 페이지 만들어보기 연습  (0) 2022.05.10
Html의 태그  (0) 2022.05.04
Html 기본 내용  (0) 2022.05.04
Web  (0) 2022.05.03