HTML

• HT : Hyper Text, 문서와 문서가 링크로 연결되어 있다.

• M : Markup, 태그로 이루어져 있다

• L : Lanquage

  • 웹사이트의 틀을 만들어 주는 마크업 언어

• java를 컴파일해주는게 jvm이면 html은 브라우저에서 컴파일 해준다

1. 툴 설치

• Visual Studio Code를 설치해서 사용한다.

단축키

• alt + b OR alt + shift + b : 브라우저 열기
• ctrl + + OR - : 화면 확대 OR 축소
• ctrl + b : 전체화면, 다시 돌아가기
• ! + enter : 기본 html 문서 타입 작성

<>,</>

• Html에서는 필요한 명령어들을 괄호안에 작성해 준다.

div

• 영역 구분을 위한 태그
• 상단, 메뉴, 본문, 하단 등과 같이 웹 페이지의 레이아웃에 대한 영역을 구분하기 위해 사용
• 서로 중첩되어 사용할 수 있으며, 다른 태그를 포함할 수 있다.

h1

• h2, h3, h4, h5 .... 숫자가 작을수록 글자가 크다

p

• 본문을 작성할때 문단단위로 끊어서 사용할 수 있다.

a

• a href="" 안에 인터넷 주소를 입력하면 사용한 글자에 링크를 걸어 줄 수 있다.

ol,ul

• ol 오더리스트 : 사용하면 1. 2. 3. 으로 숫자가 부여된 리스트가 생성된다.

• ul 언오더 리스트 : 숫자가 부여되지 않은 기호리스트가 생성된다.

hr

• 가로줄을 생성한다.

!----

• !--이렇게 작성하면 주석처리가 된다--

table

• 테이블을 생성하는데 border="2" 보더값을 지정해줘야
  선이 보인다.
• width, heigh 로 크기 조절 가능

thead, tbody, tfoot

• thead는 테이블의 제일 윗부분을 지정할때 사용한다.
  • 위치가 고정되기 때문에 어느 위치에 작성하던지 테이블 맨 위에 작성된다.
    -tbody는 테이블 본문을 지정한다.
    -tfoot은 테이블 말단을 지정한다.

tr,td,th

• tr은 테이블의 행을 나타내고 tr문 사이에 td문을 작성한다.
• td는 테이블의 열을 나타내고 tr문 사이에 작성한다.
• th는 보통 테이블 맨 위에 사용하고 글씨를 헤드라인처럼 만들어준다.

colspan, lowspan

• colspan은 가로 병함
• lowspan은 세로 병함

align=""

• 정렬을 뜻하며 center, right, left 로 정렬 해줄 수 있다.

img

• 사진을 불러오는 태그이며 img src"" 쌍따옴표 안에 이미지 주소를 작성하면 첨부 된다.

button

• 버튼을 만들어 내는 태그이며
• button type"button" 이런 식으로 사용한다.