반응형
Index
- 단락 - p
- 줄바꿈 - br
- 이미지 - img
- 표 - table
- Link (현재 페이지)
- 주요 Tag
단락 - p
<html>
<head><meta charset="utf-8"></head>
<body>
<p>HyperText Markup Language, commonly referred to as HTML, is the standard markup language used to create web pages.
Along with CSS, and JavaScript, HTML is a cornerstone technology</p>
<p>HTML elements form the building blocks of all websites. HTML allows images and objects to be embedded and can be used to create interactive forms.</p>
<p>The language is written in the form of HTML elements consisting of tags enclosed in angle brackets . Browsers do not display the HTML tags and scripts, but use them to interpret the content of the page.</p>
</body>
</html>실제 실행 결과
HyperText Markup Language, commonly referred to as HTML, is the standard markup language used to create web pages. Along with CSS, and JavaScript, HTML is a cornerstone technology
HTML elements form the building blocks of all websites. HTML allows images and objects to be embedded and can be used to create interactive forms.
The language is written in the form of HTML elements consisting of tags enclosed in angle brackets . Browsers do not display the HTML tags and scripts, but use them to interpret the content of the page.
- 줄바꿈 - br
br은 내용이 없는 태그이기 때문에 이 필요 없음.
<html>
<head><meta charset="utf-8"></head>
<body>
한 줄 바꿈<br>
두줄 바꿈<br><br>
끝
</body>
</html>실행 결과
한 줄 바꿈
두줄 바꿈
끝
- 이미지 - img
<html>
<body>
<img src="/이미지경로" width="200" height="300" alt="이미지 대체 텍스트" title="타이틀(툴팁)">
</body>
</html>- 표 - table
<tr> : Table Row
<td> : Table Data
<html>
<head><meta charset="utf-8"></head>
<body>
<table border="2">
<tr>
<td>이름</td> <td>성별</td> <td>주소</td>
</tr>
<tr>
<td>최진혁</td> <td>남</td> <td >청주</td>
</tr>
<tr>
<td>최유빈</td> <td>여</td> <td>청주</td>
</tr>
</table>
</body>
</html>실행 결과
| 이름 | 성별 | 주소 |
| 최진혁 | 남 | 청주 |
| 최유빈 | 여 | 청주 |
- 좀 더 의미론 적으로 구분한 테이블 구조.
<html>
<head><meta charset="utf-8"></head>
<body>
<table border="2">
<thead>
<tr>
<th>이름</th> <th>성별</th> <th>주소</th> <th>회비</th>
</tr>
</thead>
<tbody>
<tr>
<td>최진혁</td> <td>남</td> <td >청주</td> <td>1000</td>
</tr>
<tr>
<td>최유빈</td> <td>여</td> <td>청주</td> <td>500</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>합계</td> <td></td> <td></td> <td>1500</td>
</tr>
</tfoot>
</table>
</body>
</html>
- Link (현재 페이지)
<a href="#id_test">Top</a>
<div id="id_test">Here is top</div>위 코드에서 Top을 클릭 하면 페이지 내부에 있는 위치로 이동 하게 된다.