티스토리 뷰
728x90
Form 테그를 활용 하여 위와 같은 페이지를 만들어 봅시다.
구글에서 w3schools 를 검색 해서
저기 위 링크로 들어 갑니다.
w3schools.com 페이지가 나오면 위 빨간 박스 부분을 클릭 하여 HTML Forms 찾아요.
Try it Yourself 버튼을 눌러 줍니다. 그러면 소스가 나와요~
아래 그림에서 왼쪽 부분이 HTML 소스이고 오른쪽은 결과 화면 입니다.
왼쪽에서 소스 수정도 가능하고 Run버튼을 눌러 실행도 해볼수 있어요~
소스 수정후 Run 버튼을 누르면 오른쪽 결과 화면에 결과가 바뀌는것을 확인 할 수 있어요!!
자 그러면 처음에 우리가 만들려고 했던 Form을 만들어 봐요
w3schools에서 제공하는 샘플 소스를 활용하여 위 빨간 박스에 있는 내용만 수정 하고 Run 버튼을 눌러 봅니다.
그럼 오른쪽 화면과 같은 결과를 얻을수 있어요. 그럼 왼쪽 소스를 복사 해서 우리가 개발 하는 프로그램 툴에 붙여넣기를 해서 내 PC에서 구동을 시켜 보도록 하겠습니다.
소스
<!DOCTYPE html>
<html>
<body>
<h2>KIT 웹앱 프로그래밍</h2>
<form action="/method" method="POST">
<label for="fname">학번:</label><br>
<input type="text" id="fname" name="num" value=""><br>
<label for="lname">이름:</label><br>
<input type="text" id="lname" name="name" value=""><br><br>
<input type="submit" value="확인">
</form>
</body>
</html>'Python' 카테고리의 다른 글
| [웹 앱프로그래밍] 파이썬 플라스크(Python Flask) 설치 및 웹 애플리케이션(Web Application) 시작 (0) | 2020.04.24 |
|---|---|
| [웹 앱프로그래밍] 독립된 파이썬(python) 가상환경(venv) (0) | 2020.04.24 |
| [웹 앱프로그래밍] 파이썬(python for windows) 설치 후 vs code 개발 환경 구축 (0) | 2020.04.24 |
| [웹 앱프로그래밍] Visual studio code 설치 후 html 개발 (0) | 2020.04.13 |
| [웹 앱프로그래밍] 기본 개념 및 우리가 배우는 것들 (0) | 2020.04.07 |
댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
링크
TAG
- Java
- oracle
- Hello World
- nginx
- Visual Studio
- 도커
- javascript
- DB
- GCP
- 웹앱 프로그래밍
- HTML
- 웹앱
- 파이썬
- mysql
- 클라우드
- 플라스크
- docker
- 부트스트랩
- python
- 웹앱프로그래밍
- 리눅스
- Cloud
- github
- 자바
- 오라클
- flask
- GIT
- pythonanywhere
- WEB
- 자바스크립트
| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | 2 | |||||
| 3 | 4 | 5 | 6 | 7 | 8 | 9 |
| 10 | 11 | 12 | 13 | 14 | 15 | 16 |
| 17 | 18 | 19 | 20 | 21 | 22 | 23 |
| 24 | 25 | 26 | 27 | 28 | 29 | 30 |
글 보관함