프로젝트 생성
- Dynamic Web Project 생성
- Generate web.xml deployment descriptor 체크
- src -> main -> webapp 파일 내에서 작업
http프로토콜 동작 원리 (HyperText Transfer Protocol)
- naver.com 입력 enter
- dns 서버 (도메인 네임서버) naver.com => 해당 ip주소 얻기
- ip주소의 서버에서 접속, index.html 요청(request)
- 서버는 서버에 저장된 index.html 파일을 찾아서 응답(response)처리 요청한 사용자에게
- 사용자 브라우저에서 index.html 화면에 보이기 요청에 대한 응답처리 완료
- 연결종료 다른 파일 요청시 1~6번 반복
- Protocol : 복수의 컴퓨터 사이나 중앙 컴퓨터와 단말기 사이에서 데이터 통신을 원활하게 하기 위해 필요한 통신 규약.
HTML ( Hypertext Markup Language )
태그(엘리먼트, DOM(DOM: Document Object Model))로 구성됨
- 시작태그, 끝태그가 존재
- empty content를 가진 태그도 있다.
- 대소문자 구별x 일반적으로 소문자 사용
- 속성(attribute)를 가질 수 있으며 name=value의 형식을 갖는다.
- 1 HTML = 1 PAGE
- 태그 순서 주의 :
<a> <b> </b> </a>
- 주석 : (ctrl + shift + /)
- 주석해제 : ctrl + shift + 역슬래시
이미지 태그
<img src="이미지파일경로/이미지파일이름.확장자" width="" height="">
경로 지정 방법
- html 파일의 위치 기준으로 상대경로로 표현할 수 있음
ex) src="./images/001.png"
ex) src="../images/001.png"
.. 은 상위폴더로 이동한다는 뜻이다.
- 간편 복사 단축키 : ctrl + alt + 방향키
앵커태그, href태그, 링크 태그
- 외부 사이트나 다른 html로 이동하는 링크를 적어 이동할 수 있게 해준다.
베이스태그
- 링크에 경로가 적히지 않았을 때 base태그에 적힌 경로가 defualt로 입력된다.
<base href="">
문단태그
<p></p>
스타일태그 (내부)
링크태그 (외부)
<link rel="stylesheet" type="text/css" href="mystyle.css">
스크립트 태그
- 자바스크립트 작성
<script></script>
*주의: href나 src 작성시 "/~~"이런식으로 슬래시를 맨 앞에 붙으면 root를 기준으로 찾음