일단 하나를 해보자

<table>웹페이지에서 테이블을 만들기 위해서는 table 태그 사용함

<tr>테이블의 행(row가로줄)을 표현하는 태그

<th>열(column세로줄)의 제목을 표현하는 태그

<td> th와 마찬가지로 tr태그 안에서 사용
테이블에서의 각각 데이터를 담고있는 셀을 나타낸다.

이렇게 하고 style을 

적용해야 선이 생김

, 콤마 찍어서

한번에 값 줄 수 있음

border
padding 여백

셀병합도 속성 부여하면 됨!

위에가 셀병합한 거임

rowspan="" 가로줄, 행 ""개 셀 합하겠다
colspan="" 세로줄, 열 ""개셀 합하겠다

합할 거 태그 안에 넣어주면 됨

<textarea> 
여러줄의 텍스트를 입력받을 때 사용!

<textarea rows="" cols=""></textarea>
텍스트 (가로세로)줄수

인풋대신 버튼 만들수도 있어!

으라챠챠챠 복습끝~~~~

2일차 0806 수업

#form

<form action=""></form>
사용자가 입력한 정보를 서버로 전송할 때 사용한다.

로그인이나 회원가입 등 아이디랑 비번 입력하면 서버쪽에서 

가지고 DB확인. (암호화해서 보내면 서버에서 매칭해줌)

/ 는 주소 구분

입력받는 태그 <input>

#form전송

method="POST"
어떤 걸 입력했는지 제출했을때 안뜸!

method="GET"
아이디에 뭐썼고 비번에 뭐썼는지 보임

배울 때 저 

name

value

의 차이가 뭔가, ""안에 어떻게 써야하는건가 어려웠는데 

name을 내가 임의로 짓는 이름

value가 서버로 전달되는 정보값인가? 로 일단 이해함

!

파일명, 폴더명의 중요성 어필

네이밍 중요하다

누가봐도 알 수 있게 이름지을 때 풀네임으로 짓는 게 좋다.

#중복선택/단일선택 폼

방금 문제원인 찾았다...

나는 왜 value값이 제목으로 들어가고 그다음 작성한 값이 셀에서 튀어나오나..

취미선택 1개만 되어야하는데 왜 중복으로 되는가..

뭐가 문제인지 몰라서 밑에 똑같이 다시 써봤는데

인풋타입 radio를 "안닫고 써버려서 name이랑 합쳐진거였다

<label>은 인풋테그 쓸 때 연결해서 자주 쓴다

라벨을 인풋 요소와 연관시키려면 

<input>에 id속성을 넣어야한다. 그런 다음 <label>에 id와 같은 값을 for속성을 넣어야 한다!

(둘이 같이 다녀~)

id는 하나만 됨, 고유함

<fieldset> 하나의 폼에서 여러 구역을 나눠서 표기할 때 사용(그룹화함)

<legend> fieldset으로 묶은 그룹에 제목을 붙여준다

#날짜

근데 얘는 id넣었는데 for안넣어도 되나보네

위에꺼는 라벨, 인풋을 따로써서 연결한거고 라벨 안에 인풋써서 그런가? 흠 알다가도 모르겠구만.

id는 고유한 값으로 한번만 쓸 수 있지만
class는 여러 번 쓸 수 있다! 막써도 됨. 애니메이션 등 모양바꾸고 꾸미는 역할해줌

#

autofocus 는 깜박이는 커서
required 는 반드시 입력해야하만 하는 내용, 빈칸전송시 오류라고 표시됨
placeholder 처음부터 저렇게 표기되어 나타남

lable class="res"

에서  class="res"

은 왜 있는거지??? 

빼본거랑 차이가 없어서 모르겠다.

#select

<select> 선택툴

오 인풋자리에 들어가는거같음 얘도 id로 라벨이랑 연결하는구나..

<option value=""></option>
선택옵션
option value-> 서버에 전송할 값을 뜻함

div 콘텐츠
엄청많이씀!

#경로 조심!!

위처럼 깔끔한 이유는 ul에 스타일 적용했기 때문인데

보통 스타일을 html에 넣지 않고 css파일 만들어서 따로 담아줌

이때 style을 따로 폴더링하니까

링크를 연결해줘야함!!!

style에서 태그로 직접 디자인

{} 비어있다는 뜻

필드셋 너비 500픽셀로

list-style: none;으로

ul의 동글벵이 뺌 (위 이미지가 뺀거임)

list-style
text-align 가로정렬
foat 주위감싸는 텍스트정렬설정
padding-left 안쪽 여백 영역 설정

(style은 body보다 앞에 뜨게 head에 넣어줌)

href에 경로설정! 

아까 계속 스타일이 적용 안돼서 

당황했는데

./에는 없었고

../에는 있더라고! 그렇게 연결했다.

2일차 0806 수업

제목으로는 내용을 써야겠으

<img src=" 사진경로 넣어주면됨"/>

에러 나길래 찾아보니까 이미지 경로 지정방법 절대경로/상대경로있다는데

절대경로- 웹페이지 "이미지주소복사" 해서 넣은 방법이라 생각.

상대경로- 이미지 삽입할 HTML문서 기준으로 경로 인식(, 내 컴퓨터파일에 있는 사진경로)

하위폴더로 이동하는 법: 하위 폴더명 적어주고 /

상위,하위폴더 뭔말인지는 모르겠지만 경로찾는 법은 밑에걸 써서 했음 

../  는 상위폴더로 이동하는 법

이미지 파일이랑 html파일이 다른 폴더에 있으면 이미지 파일경로 넣어줘야함!!

alt는 이미지 깨졌을때 안내문구
width 너비 
height 키

png 원본손실이 없는 무손실 압축, 일반적으로 웹에서 가장 많이 사용
jpg 손실압축으로 사진 이미지의 압축 효율이 좋음 주로 사진 이미지를 저장하는데 사용
gif 애니메이션을 지원함, 짤
svg (일반적으로는 잘 안쓰지만) 안깨져
raw 압축 이전의 확장자, 원본파일, 한 픽셀에 대해서 rgb색값이 있음
(->raw모드로 이번 포스터촬영해서 용량거덜났잖아 나..)

근데 걍 X방향 너비w Y방향 키,높이h로 생각하면 될 듯