HTML(Hyper Text Makeup Language)
경로
-절대 경로 : http://localhost:8090/Context명/경로/a.html
Project 명 => 경로 => a.html
-상대 경로 : a.html기준(현재 내위치 기준)
상위 폴더 가는 법: src=../001.png(한칸 위 '..' 지금 내위치 폴더 기준)
같은 레벨 : src = "001.png"(가고자 하는 파일이름)
하위 폴더 : 같은 레벨의 c폴더 아래 001.png접근
URL : http://서버IP:포트번호/Context명/자원((ex)html,jsp,서블릿,이미지,Css,js파일)
WEB
- 브라우저 -> 서버 : 요청
- 브라우저 <- 서버 : 응답(a.html)
- a.html을 브라우저 메모리에 저장 =>캐시 메모리에 저장(성능 굿)
Status:
404 - file not found
500번대~ : 서버문제
200 - 성공
CSS
html태그에 접근할때는 선택자를 이용해 접근한다.
링크 태그는 외부 CSS파일을 지정할때 사용된다.
html파일
<script type="text/javascript" src="경로"></script>
==>external 방식
<script type = "text/javascript">
document.write("")
</script>
==>internal 방식외울것 :
p태그 : 단락
a태그 (앵커 태그): 링크 목적
-1. 외부 html로 이동: 같은 Domain이 아닌경우
-2. 같은 Domain내의 다른 html로 이동
-3. 같은 html페이지 내에서 이동
js,Css
=> 선택자 태그명을 통해 접근
<p>~~</p>p{}
=> id를 통한 접근: =>같은 html: id명
=> 외부 html : #{id명}
테이블(표) 만들기
<head>헤더
<foot>바닥행
<body>몸체위 와같은 순서로 코드 작성한다.
colspan = 2 2열1행 3열 1행 셀 병합
rowspan =2 1열 2행 1열 3행 셀 병합
nav 태그: 메뉴
태그그룹(Grouping)중요!!
block level(세로배치)
예) div, h1~h6, br태그, p태그, ul태그 ...
inline level(가로배치)
예)span img ...
이렇게 태그 별로 정해져 있지만 CSS로 Block level과 inline level간 설정 변경이 가능하다.
html tag =>내용 BOX Model
폼요소
엄청 중요하다.
사용자가 입력하는 곳을 만드는 것.
name/value 값으로 자바의 HashMap과 같이 작동한다.
차이점은 같은 name으로 value값을 추가하면 폼 태그에서는 값을 추가해 배열을 만들지만 자바의 HashMap은 기존의 key값의 해당하는 값을 수정해버린다.
밑에 필기 된 것 보고 name/value값이 어떻게 브라우저에 입력되는지 DomTree가 어떻게 짜여지는지 중요하게 살펴봐야한다.
text필드
<form>
이름<input type ="text" name="name" id="name">
autofocus = >브라우저를 열면 자동으로 해당 장소에 커서를 준다.
<input>인풋 타입:
- text
- radip
- checkbox
- number
- color
- date
=> 해당 실습자료는 html_css2에 저장되어 있다.
Get 과 Post의 차이점.
이제 알고리즘 공부하러 가자. 2시간 30분밖에 안남은거 실화냐..
