본문 바로가기
Java Web Programming/1. HTML | CSS

[HTML] HTML 기본 개념 정리 (+Javascript, CSS, XML)

by 파프리카_ 2020. 8. 18.
728x90
반응형
  • HTML : 웹문서의 컨텐츠 (의미, 구조)
  • CSS : 웹 문서의 디자인(스타일)
  • JavaScript : 웹 문서의 동작

HTML 

: HyperText Markup Language

→ 웹 문서의 화면 구성을 정의하는 언어

 

HTML 필요 시 참고 사이트

참고 사이트 : www.w3schools.com

 

W3Schools Online Web Tutorials

HTML Example:

This is a heading

This is a paragraph.

Try it Yourself » CSS Example: body {   background-color: lightblue; } h1 {   color: white;   text-align: ce

 

www.w3schools.com

 

 

 

HTML 기본 구성

<!DOCTYPE html>   <!-- html 주석 | html 5 버전 문서임을 명시하는 선언부--!>

<html>

<head>  <!-- 본문 화면에는 표현되지 않고, 현재 문서 설정 정보를 저장-->

</head>

<body>  <!-- 본문 화면의 디자인 구성 : 웹 화면을 표현 -->

<br>  <!-- 행 변경 -->

<img src ="">  <!-- 이미지 표현 -->

</body>

</html>

 

 

예제

<!DOCTYPE html> <!-- html5 선언부 -->
<html>
<head> <!-- 현 웹 페이지의 설정 정보 명시 -->
<meta charset="UTF-8"> <!-- 한글 처리 방식을 명시 -->
<title>step1 html</title> <!-- 제목표시줄에 표현(웹브라우저 상단부) -->
</head>
<body> <!-- 본문 화면에 표현됨 -->
 Hello HTML <br> <!-- 행 바꿈 -->
 <font size="7" color="green"> 생일 축하합니다 ~ </font>
</body>
</html>

 

웹 페이지 예제


Javascript 

: 웹 문서의 동작을 담당

* 최근에는 서버 사이드 프로그래밍도 지원


CSS

: 웹 문서의 디자인 스타일을 담당


XML

: Extensible Markup Language

: 웹 문서의 설정 정보 담당

- 주로 웹 어플리케이션 or WAS 설정 정보를 명시할 때 사용

- 테이터 통신용으로도 사용되었지만 최근에는 JSON을 주로 이용하는 추세이다

728x90
반응형