TAG는 설명
<html></html> : 전체 html 코드를 감싸는 태그
<head></head>: 본문을 설명하는 태크
<title></title> : 웹페이지 제목
<meta charset="utf-8"> : utf-8로 html를 해석
<body></body> : 본문
<strong></strong> : 진하게
<u></u> : 밑줄 쫙
<br> : 줄바꿈
<p> </p> : 단락 줄바꿈(br과 비슷하지만 더 정보를 담고있음)
<img src="이미지 주소" width="100%> : 이미지 넣기
(src와 width는 속성(Attribute) 이고 순서에 상관없음)
unordered list
<ul>
<li> </li>
</ul> : 부모 태크와 자식태그(e.g. ul은 li(목록)의 그룹(시작부터 끝)을 나타냄)
ordered list
<ol>
<li> </li>
</ol> : 위와 같으나 자동으로 넘버링
테이블은 3대(조부모,부모,손자)가 필요함
<table>
<tr>
<td>head</td>
<td>98.1%</td>
<tr>
<td>body</td>
<td>97.9%</td>
<tr>
<td>html</td>
<td>97.9%</td>
</tr>
</table>
head | 98.1% |
body | 97.9% |
html | 97.9% |
html의 혁명 : hyper link 기능
<a href="http://www.google.com" target="_blank" title="google"></a>
href는 클릭시 링크될 url, target으로 새탭으로 만들기 가능, title로 이동전에 설명을 추가할수 있음
동영상 삽입(<iframe>)
<p>
<iframe width="560" height="315"
src="https://youtu.be/PtxFi72Vbh4"
frameborder="0" allowfullscreen></iframe>
</p>
'웹 프로그래밍 > 프론트 엔드' 카테고리의 다른 글
타임리프(스프링 통합과 폼) (0) | 2023.04.13 |
---|---|
Thymeleaf(타임리프) 기본 (0) | 2023.04.11 |
Thymeleaf(타임리프) 기초 (0) | 2023.04.11 |
JavaScript 기초 (0) | 2023.04.02 |
CSS 기초 (0) | 2023.04.02 |