728x90
반응형
연습문제.zip
9.51MB
images.zip
0.11MB
연습문제1.html
0.00MB
연습문제2.html
0.00MB
연습문제3.html
0.00MB
연습문제4.html
0.00MB
연습문제5.html
0.00MB
연습문제1.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>수습 국원 지원 양식</h1>
<table border="1" style="height: 500px; width: 800px;" >
<tr>
<th rowspan ="3">개인정보</th>
<th>이름</th>
<td style="width: 300px;"></td>
</tr>
<tr>
<th>학과/학번</th>
<td></td>
</tr>
<tr>
<th>연락처</th>
<th></th>
</tr>
<tr>
<th>지원분야</th>
<th colspan = "2"></th>
<!--<th></th>-->
</tr>
<input type="button" value="공지 창 닫기" onclick="window.close()">
</body>
</html>
연습문제2.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<fieldset>
<h1>수습 국원 지원 양식</h1>
<h2>방송에 관심 있는 새내기 여러분 환영합니다</h2>
<p>교내 방송국에서 신입생을 대상으로 수습 국원을 모집합니다. 학부와 전공은 상관없습니다.</p>
방송에 관심 있는 여러 학우의 지원 바랍니다.
<ul>
<li>모집 기간 : 3월 2일 ~ 3월 11일</li>
<li>모집 분야 : 아나운서, PD, 엔지니어</li>
<li>지원방법 : 양식 작성 후 이메일 접수</li>
</ul>
<EM>지원서 양식은 교내 방송국 홈페이지 공지 게시판에 있습니다.</EM>
<h3>혜택</h3>
<ol type="a">
<li>수습기자 활동 중 소정의 활동비 지급</li>
<li>정기자로 진급하면 장학금 지급</li>
</ol>
<img src = "images/camara.avif" alt="카메라" width="30%", height="30%">
<input type="button" value="공지 창 닫기" onclick="window.close()">
</fieldset>
</body>
</html>
연습문제3.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<fieldset>
<h1>프런트엔드 개발자 지원서</h1>
HTML, CSS, 자바스크립트의 기술을 이해하고 실무 경험이 있는 분을 찾습니다.
<br>
<hr>
<h4>개인 정보</h4>
<blockquote><label for="name">이름</label>
<input type="tel" id="name" placeholder="공백 없이 입력하세요.">
</blockquote>
<ul>
<label for="number">연락처</label>
<input type="tel" id="number">
</ul>
</li>
</ul>
<h4>지원 분야</h4>
<label><input type="radio" name="1">웹 퍼블리싱</label> <br>
<label><input type="radio" name="1">웹 애플리케이션 개발</label> <br>
<label><input type="radio" name="1">개발 환경 개선</label>
</li>
</ul>
<h4>지원 동기</h4>
<fieldset>
<label for="memo">메모</label>
<br><textarea id="memo" cols="40" rows="4" placeholder="본사 지원 동기를 간략히 써 주세요"></textarea>
</fieldset>
<div>
<input type="submit" value="접수하기">
<input type="submit" value="다시쓰기">
</div>
</fieldset>
<input type="button" value="공지 창 닫기" onclick="window.close()">
</body>
</html>
연습문제4.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>이미지 삽입하기</h1>
<img src = "images/umbrella.jpg" alt="레드향", width="320", height="210">
<br>
<hr>
<h1>포털 사이트 Daum으로 연결하기</h1>
<a href="https://www.daum.net/" target="_blank">다음 이동(target)
<img src = "images/daum.jpg" alt="daum" width="30%", height="30%">
</a>
<input type="button" value="공지 창 닫기" onclick="window.close()">
</body>
</html>
연습문제5.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<form>
<fieldset>
<h2>예약정보</h2>
<form>
<li>
<label for="user-name">이름</label>
<input type="text" id="user-name">
</li>
<li>
<label for="address">배송 주소</label>
<input type="text" id="address" required>
</li>
<li>
<label for="mail">이메일</label>
<input type="email" id="mail">
</li>
<li>
<input type="submit" value="예약하기">
</li>
</ul>
</form>
</fieldset>
<input type="button" value="공지 창 닫기" onclick="window.close()">
</body>
</html>
728x90
반응형
'HTML' 카테고리의 다른 글
| HTML(iframe)_2024-07-03 (2) | 2024.07.03 |
|---|---|
| HTML(블록과 인라인)_2024-07-03 (2) | 2024.07.03 |
| HTML(이미지)_2024-07-02 (0) | 2024.07.02 |
| HTML(테이블)_2024-07-01 (0) | 2024.07.01 |
| HTML(VS Code 확장 프로그램)_2024-07-01 (0) | 2024.07.01 |
