https://opentutorials.org/course/2039
HTML 수업 - 생활코딩
수업의 목적 본 수업은 HTML에 대한 심화된 내용을 다룹니다. HTML의 기본문법과 HTML의 주요한 태그들에 대한 수업을 담고 있습니다. 선행학습 본 수업을 효과적으로 수행하기 위해서는 웹애플리
opentutorials.org
위의 수업을 다 보고나서 전체적인 정리를 한 것이다.
HTML을 정보를 전달하는 관점에서 생각하자.
<!DOCTYPE html>
<html>
<head><!--본문의 내용이 아닌 경우 head에 넣는다-->
<meta charset="UTF-8">
<!--인코딩 방식 설정-->
<meta name="description" content="자료">
<!--요약 자료로 사용될 경우가 상당히 높다-->
<meta name="keywords" content="코딩,coding">
<meta name="author" content="bae">
<meta http-equiv="refresh" content="30">
<!--30초 마다 refresh된다-->
</head>
<body>
<form action="http://localhost/hidden.php">
<input type="text" name="id">
<input type="hidden" name="hide" value="first">
<!--화면에 보이지는 않지만 서버로 데이터를 보낼때 사용-->
<input type="submit">
</form>
<form action="">
<p>
<label for="id_txt">text : </label>
<!--label을 통해 이름표를 부여, for를 사용해서 input과 연결-->
<input id="id_txt" type="text" name="id" value="default value"></p>
<!--input의 id 값을 부여 후 label에 넣어야함-->
<p>
<label for="password">password :</label> <input id="password" type="password" name="pwd" value="default value"></p>
<p>
<label>textarea : <textarea cols="100" rows="10">default value</textarea></label></p>
<!--label을 감싸서 id 부여 없이 사용 가능-->
<p>
<label>
<input type="checkbox" name="color" value="red"> 붉은색
<!--label로 감싸면 이름을 눌러도 체크가됨-->
</label>
<input id="color_blue" type="checkbox" name="color" value="blue"><label for="color_blue"> 파랑색 </label>
</p>
</form>
<form action="http://localhost/method.php" method="post">
<!--get은 url을 통해서 데이터 전달 method post를 사용하면 다른 방식으로 데이터 전달-->
<!--form을 이용해 데이터를 전송한다면 post를 사용해야한다-->
<input type="text" name="id">
<input type="password" name="pwd">
<input type="submit">
</form>
<form action="http://localhost/upload.php" method="post" enctype="multipart/form-data">
<!--파일 업로드 기능을 사용할려면 enctype="multipart/form-data"를 꼭 사용해야함-->
<input type="file" name="files">
<input type="submit">
</form>
<font size="8" color="red">Hello</font>world
<!--font태그는 사용하면 안됨-->
<!--CSS를 사용해야함-->
</body>
</html>
'프로그래밍 > HTML' 카테고리의 다른 글
div 태그와 span 태그 (0) | 2021.08.09 |
---|---|
HTML 기초 3 (0) | 2021.07.23 |
HTML 기초 1 (0) | 2021.07.21 |