[HTML5 + CSS3 + JavaScript]
:: 웹 페이지의 내용은 html5로 작성
:: 웹 페이지의 스타일은 css3로 작성
:: 웹 페이지의 상호작용은 javascript로 작성
[HTML5란?]
:: Hyper Text Markup Language의 약자로 마크업 언어라고 줄여 말한다.
Hypertext |
클릭해서 다른 곳으로 이동할 수 있게 하는 하이퍼링크 기능을 웹으로 옮겨 온 것. 다른 사이트의 페이지나 멀티미티어 등으로 연결하는 것 |
Markup Language |
문서에 명령을 표시했다는 의미 |
[HTML 주소]
:: http://www.google.com/bbs/board.jsp
http |
프로토콜 |
www |
웹 서비스 |
google.com |
접속할 서버 컴퓨터 주소(도메인) |
bbs |
서버 컴퓨터에서 찾아갈 폴더 이름 |
board.jsp |
서버 컴퓨터 폴더에 있는 파일 이름/ 현재 브라우저에 표시된 파일 |
[웹과 관련된 다양한 언어]
1. JavaScript
:: 웹 문서에 동적인 효과를 추가
:: 웹 브라우저 창이나 웹 문서 조절, 사용자 동작에 반응 등 역할
2. jQuery
:: javascript 기능을 패키지화
:: 여러 가지 플러그인이 만들어지고 있어서 사용이 쉽다
3. 서버 프로그래밍 언어
:: ASP,JSP,PHP등 서버 컴퓨터에 정보를 저장하거나 검색,수정하기 위한 언어
[HTML의 구조]
haeding <hn>태그 |
제목 부분은 다른 텍스트보다 크고 진하게 표시한다. <h1> ~ <h6>까지 사용 가능하며 n의 숫자가 커질수록 글씨 크기가 작아진다. |
<body>태그 |
특별한 태그 없이도 텍스트를 표기할 수 있고 웹 문서의 내용에 해당하는 부분 |
<p> |
단락의 전-후에 빈 줄이 생기면서 텍스트 단락이 만들어 진다. <p>태그를 <br>태그 대신 사용하면 안됨 |
<br> |
강제 줄 바꿈 태그 |
<pre> |
프로그래머가 입력한 그대로 화면에 출력하는 태그로 형식에 영향을 주는 태그는 사용하지 않는 것이 좋다 |
<blockquote> |
다른 곳의 내용을 인용할 때 사용하며 다른 텍스트보다 약간 들여 써진다. |
// |
주석으로 comment를 달 수 있다. |
<hr> | 수평선 그리기 |
텍스트 서식 |
|
<b> |
볼드체 |
<i> |
이텍릭체 |
<strong> | 굵게 |
<em> | 텍스트 강조 |
<code> | 텍스트가 코드임을 표시 |
<sup> | 위첨자 |
<sub> | 아래첨자 |
특수 문자 | |
| 공백 문자 한 개 |
< | < |
> | > |
" | " |
& | & |
리스트 | |
<ol> | 각 항목을 순서대로 나열 할 때 사용 |
| <li> | 각 항목을 순서대로 나열 할 때 사용 start: 시작 번호 |
<ul> | 항목의 순서가 중요하지 않는 목록 |
| <li> | 항목의 순서가 중요하지 않는 목록 |