HTML

화면을 구성하는 여러가지 태그를 갖고 있다.

헤드태크의 필요성 css,jsp를 헤드 태그 안에 구성하기때문.

 

web & html 작동원리

서버는 클라이언트의 요청 내용을 분석하여 결과값을 HTML로 전송!

서버는 결과값을 전송한 후 클라이언트와 연결 종료(stateless)

데이터를 보내주면 여기서 연결을 끝내버린다. 클라이언트의 상태를 계속 가지고 있을 수 없기 때문에.

 

HTML은

웹 페이지 문서 담당이다. (구조)

웹 문서를 작성한다.

 

tag중심이다.

시작과 종료 tag가 있는 것이 있고 시작 tag만 있는 것들도 있다.

html은 에러를 표시하지 않는다. 

 

html tag에는 어느 tag에나 넣어서 사용할 수 있는 글로벌 속성이 존재한다. 

대표적으로

class 태그의 이름이다.

중복을 허용한다!

id 는 태그의 유일한 값이다. 

모든 값에 설정을 줄땐 id를 사용하고 

몇개의 값만 지정하거나 하나의 값만 지정할때 class를 사용한다.

id는 자바스크립트에서 자주 사용된다. 

근데 자바스크립에서는 중복이 안된다. 

여러개의 똑같은 id를 사용하는게 있으면 맨위에껏만 찾아서 동작한다.

 

단축키 활용

h3해놓고 엔터치면 자동으로 태그가 만들어진다.

 

다른 태그도 가능하다

태그이름.(클래스이름)*만들개수

 

또 하나 중요한 점 이건 꼭 외우자!

html은 태그 기준이라서

<>""&이런것들을 문자열로 바로 칠수 없다. 

그래서 엔티티 이름을 쳐서 출력을 해줘야한다.

&nbsp = 화면에 공백을 출력한다.

&lt = (less than) 화면에 <을 출력한다.

&gt = (greater than) 화면에 >을 출력한다.

&amp = (Ampersand)  화면에 &을 출력한다.

&quot = (Quotation mark) 화면에 "을 출력한다.

 

셀패딩은 셀과 벽의 간격

셀 스패싱은 셀끼리의 간격 

 

이미지 태그 !

 

이미를 불러올 때 경로상

../ 바로 하나위

./ 현재

/ 최상위로 가서 불러온다

ex)  <img = src ="../img/night.png" >

 

a태그 !

하이퍼링크를 불러주는 태그

<a href = "www.naver.com">

이런 사이트뿐만 아니라 이동할 문서나 책갈피로도 이동이 가능하다.

<a href = "#id1">

<a href = "#id2">

<a href = "#id3"> 

 

form에다가 메소드는 post다 표시하지 않으면 싹~! 다 get방식이다.

get방식은 간단한거 넘길때 사용한다!

아이디 비밀번호같은 것들 !

 

method = 사용자가 입력한 내용을 서버 쪽 프로그램으로 어떻게 넘겨줄 지 결정.

속성값에는post와 get방식이 있다.

name = form의 이름을 지정. 한 문서 안에 여러 개의 from태그가 있을 경우, 구분자로 사용.

action = form 태그 안의 내용들을 처리해줄 서버상의 프로그램 지정. (URL)

 

체크박스는 다중 선택

다리오 박스는 단일 선택

checked는 시작부터 체크되서 나옴

 

input에서 submit이나 reset은 기능이 있다. 

하지만 button은 기능이 없어 왜 ? 본인이 구현하고 싶은거 구현하는 거라서! 

그래서 onclick을 열어서 클릭시 ~~처럼 작동해라 라고 구현하는 것이다.

readonly,disable 수정못하게 하는 것임

readonly는 전송이되지만disable은 아예 쓰지 않겠다는 뜻임.

 

버튼 이라는 태그 자체도 따로 있다 속성이 아니라 태그로써

인풋과의 차이점은 아이콘이나 뭐 이미지 같은 것들을 추가할 수 있어서 시각적으로 좀 더 세련되 보인다.