html/css #19-form

 

form으로 데이터 보내기
<속성설명>
action: 보낼 곳을 적는다. (ex. <form acion: //www.youtube.com ... )
input : 입력을 받는 여러가지 폼의 종류이다. 

                <form action="https://www.youtube.com">

                    <label>이메일주소</label>

                    <input type="text">

                    <label>비밀번호</label>

                    <input type="password">

                    <button>로그인하기</button>

                </form>

 

 

 

form태그 세부 내용 채우기
legend는 form태그에 종속적인 제목 태그이다. 
label for 를 통해 각각의 용도를 설명해준다.
button type은 submit

*lable의 for과 input의 ip를 동일한 이름으로 잡아준다. 

                <form action="https://www.youtube.com">

                    <legend>이메일로 로그인하기</legend>

                    <label for="username">이메일주소</label>

                    <input id="username" type="text">

                    <label for="password">비밀번호</label>

                    <input id="password" type="password">

                    <button type="submit">로그인하기</button>

                </form>

 

 

 

all: unset 

ㄴ 윈도우에서 제공하는 쓸만한 속성들도 모두 unset 되므로 주의

ㄴ 대표적으로 display: block 요소들이 inline 으로 변한다. 

 

 

 button 요소를 컨테이너 크기만큼 가득 채우기 (button / input)
inline-size: 100%로 맞춰야함! 
display: block -> 인라인에서 블록레벨로 변경해줘야한다! 

 

초기화를 이렇게