오늘은 웹 프로그래밍 수업을 토대로 배운 내용과 실습을 통해서 알아낸 정보를 공유해보고자 한다.
1. html을 이용한 기초 front-end 구현
<html>
<head><title>1900000 Noeyh 웹프연습</title></head>
<body style = "background-color:yellow">
<hr><h2>게시판</h2><hr>
<table border = "1">
<tr>
<th>ID <th>이름 <th>학년 <th>내용
<tr>
<td>ppiyak <td>나삐약 <td>2 <td>저는 아직도 삐약이라서 코딩이 어려워요
<tr>
<td>noeyh <td>hyeon <td>2 <td>현이라고 합니다
<tr>
<td> <td> <td> <td>
</table>
 ID: <input type="text" name="id"> <br>
이름:<input type="text" name="person"> <br>
학년: <input type="radio" name="grade" value="1">1
<input type="radio" name="grade" value="2">2
<input type="radio" name="grade" value="3">3
<input type="radio" name="grade" value="4">4 <br>
내용: <input type="text" name="any" size = 50> <br> <br>
</body>
</html>
사용하였던 html의 기능들을 설명하도록 하겠다.
<hr> : 가로선을 긋는 태그. _solotag
<h2> </h2> : 헤더태그, 글자 크기를 조절하는 태그
<table border = " "> </table> : 표를 나타내는 태그
<tr> : 표 내에서 행을 나타내는 태그
<th> : 헤더 칸을 나타내는 태그 (기본스타일 : 중앙정렬, 두껍게)
<td> : 일반적인 칸을 나타내는 태그(기본스타일 : 왼쪽정렬)
<br> : 줄바꿈 태그 _ solotag
  : 칸을 띄우는 태그(big spacebar)
: 칸을 띄우는 태그 (normal spacebar)
<input type = "text" name=" id" > : text를 입력하는 타입이고, id라는 이름으로 입력값을 보내는 태그 (후에 back-end와 연결)
<input type = "radio" name=" " value=" "> : 이렇게 type설정과 여러가지가 참 많다... 구글링 메모.....
이렇게 html의 table을 만들어보았고, input type을 이용하여 id와 학년 등을 입력받는 실습을 진행해보았다.
더 많은 기능들과 태그를 사용할 시에 유용한 사이트는 아래 링크를 참고하길 바란다.
HTML h1 - h6 태그 - 제타위키 (zetawiki.com)
HTML h1 - h6 태그 - 제타위키
다음 문자열 포함...
zetawiki.com
'web > html' 카테고리의 다른 글
| 웹 프로그래밍(HTML5+CSS+javaScript) - 3 (Javascript) (0) | 2025.10.27 |
|---|---|
| 웹 프로그래밍(HTML5+CSS+javaScript) - 2 (CSS) (0) | 2025.10.27 |
| 웹 프로그래밍(HTML5+CSS+javaScript) - 1 (html) (0) | 2025.10.27 |
| 프론트 링크 자료 모음🎱 (0) | 2023.01.20 |