<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h1 align="center" title="문단의 제목을 출력합니다.">제목-1</h1>
<h2>제목-2</h2>
<h3>제목-3</h3>
<h4>제목-4</h4>
<h5>제목-5</h5>
<h6>제목-6</h6>
<hr width="600" align="right">
<p><b>HTML</b> ,<i>CSS</i>, JavaScript, jQuery를 공부중입니다. 다음에는 Servlet 과 JSP를 배울예정 입니다.</p>
<p> HTML 과 CSS를 웹문서에서 <br><br><br> 웹다지안이르 구현 하기 위한 언어입니다.</p>
<p><홍길동>님 & " 임꺽정님 "님 반갑습니다.
<pre>홍길동님, 만나서 반가웠습니다.
다음에 다시 만나요 </pre>
<div style="font-size:24px;">오늘은<span style="color: red;">2021년 12월 16일 목요일</span></div>
</body>
</html>
태그 설명
Markup Language 주석문
HTML(Hyper Text Markup Lanage) : 웹문서를 구조적으로 표현하기 위한 언어
=> 브라우저 엔진에 의해 해석되어 출력 - CSL(Client Script Language) : HTML , CSS , JAVASCRIPT
=> 태그를 사용하여 박스모델로 표현 - DOM(Document Object Model)
태그를 사용하여 HTML 문서를 작성한다. 태그는 대소문자 미구분
시작태그와 종료태그가 하나의 짝으로 구성 - 독립태그 존재
태그는 계층적 구조로 표현 - 상위태그와 하위태그 존재 : DOM Tree
시작태그와 종료태그 사이에 하위태그 또는 태그내용 표현
시작태그에는 속성과 속성값을 사용하여 태그를 다양한 형태로 표현
DOCTYPE : 문서 형식(필수) - HTML5를 사용하여 문서 표현
html 태그 : HTML 문서의 최상위 태그
=> 하위태그 : head , body
head 태그 : HTML 문서에 대한 (정보)를 제공하기 위한 태그
=> 하위태그 : meta, title, style, script, link 등
meta 태그 : HTML 문서에 대한 부가적인 정보를 속성과 속성값으로 제공하는 태그
charset 속성 : HTML 문서에 대한 문자형식을 속성값으로 설정
=> 브라우저가 HTML 문서를 해석할 때 사용되는 인코딩 방식 설정
=> 기본 속성값 : ISO-8859-1(서유럽어)
<meta charset="UTF-8"> 뜻은 이문서는 인코딩이 UTF-8 으로 해석해서 실행
title 태그 : 웹문서 제목 설정
body 태그 : 브라우저 도큐먼트(Document)에 텍스트 또는 이미지를 출력하기 위한 태그
=> 하위태그 : h1, div, p, img, span, form 등 - 박스모델(BoxModel) 태그
박스모델 태그는 블럭 레벨 태그와 인라인 레벨 태그로 구분
=> 블럭 레벨 태그(밑으로 추가됨) : 하나의 태그가 하나의 라인(Line)을 모두 사용하는 태그 - div ,h1 , p , ol ,ul 등
=> 인라인 레벨 태그(옆으로 추가됨) : 하나의 태그가 라인 일부분을 사용하는 태그 - span, img, input, select 등 존재
hn 태그 : 태그의 내용의 문단 제목으로 출력(n : 1~6 - 제목의 크기))
align 속성 : 태그내용을 정렬하여 출력하기 위한 값을 속성값으로 설정
=> 속성값 : left(기본) , right , center , justify
title 속성 : 툴팁 기능으로 출력된 내용을 속성값으로 출력
hr 태그 : 수평선 출력
width 속성 : 박스모델의 폭을 속성값으로 설정
단위 : px(기본) , %(백분율) 등 ,(픽셀은 고정크기 , % 유동크기)
해상도가 높을수록 선명하지만 단점은 작아짐
p 태그 : 태그내용을 하나의 단락으로 표현하여 출력
=> 태그내용이 박스모델의 폭을 벗어날 경우 자동 줄바꿈 - 엔터와 줄바꿈은 아무런 상관이없다.
=> 공백이 여러 개 존재해도 하나의 공백으로 처리
b 태그 : 태그 내용을 굵게 출력
i 태그 : 태그 내용을 기울어지도록 출력
br 태그 : 줄바꿈 (엔터)
HTML 에서 표현 불가능한 문자는 Escape 문자로 표현
(공백 - 스페이스바 ),&(&),<(<),>(>),"(") 등
<홍길동>님 & " 임꺽정님 "님 반갑습니다.
pre 태그 : 태그내용을 그대로 출력
div : 박스모델을 하나의 영역으로 표현 - 블럭 레벨
span : 박스모델을 하나의 영역으로 표현 - 인라인 레벨
style 속성 : 박스모델의 디자인 (CSS 스타일)을 속성값으로 설정
'BACKEND > 스프링 Spring Boot' 카테고리의 다른 글
| 211227 (0) | 2021.12.27 |
|---|---|
| 211226 [일요일] 초조해지지말자 (시작,매일꾸준히 올리겠습니다.) (10) | 2021.12.26 |
| [Web] Web Server와 WAS의 차이와 웹 서비스 구조 (2) | 2021.12.16 |
| 영화예매 시스템 (배열로) (1) | 2020.08.18 |
| 오버로딩 , 참조함수 가지고 놀기 ( 주소값 할당) (0) | 2020.08.13 |
