하....뭘 잘못누른건지 다날라가있다...힘들게 작성 다했는데..;;;;;;세상짜증나네......
📖html의 구성
1. 태그
<태그></태그> : 괄호 열고 닫고 의미한다!
ex) <head> </head>2.
📖form 태그 (input 태그 + type 속성)
<form>
<input type="text">
<input type="password">
......
type 종류는 많다!!
</form>📖form label 태그
<form>
<label>
이름 : <input type="text">
</label>
<!--for : id를 위한 label-->
<label for="chbStudy">공부 여부</label>
<input type="checkbox" id="chbStudy">
</form>
=> 이름 : 을 눌러도 커서가 창에 깜빡거리게 할 수있고
=> 공부여부 를 눌러도 체크박스에 체크가 가능!!!!!!!
📖fieldset legend 태그
<fieldset>
<legend>기본정보</legend>
<input type="text" readonly>
<input type="text">
</fieldset>
<fieldset>
<legend>추가옵션</legend>
<input type="radio">
<input type="radio">
<input type="radio">
<textarea readonly>초기값 문자</textarea>
<textarea></textarea>
</fieldset>=> fieldset 태그 : 창 밖에 하나의 창이 또 감싸고있는!
=> legend 태그 : 창 밖의 다른창의 제목
=> readonly 속성 : 텍스트창에서 쓰지못하게 하는 기능
📖select 박스 => select 태그 (option 태그)
<label>식사구분기본
<select>
<option value="brf">아침</option>
<option value="lcn">점심</option>
<option value="din">저녁</option>
<option value="nig">야식</option>
</select>
</label>=> label 태그 : 식사구분기본에 마우스를 놓아도 커서가 창에 깜빡 거릴수 있게 하는
=> select 태그(option 태그) : option 에 있는게 선택할 수 있는 창인거야!
=> value 속성 : 서버로 전송될때는 value에 입력된게 전송
// 사용자들은 아침 점심 저녁 야식을 보고 체크 하는데 막상 서버로 전송되는건 brf lcn din nig가 전송되는것!
✔️ select 박스 기능 (속성)
1. disable : 비활성화, 선택하지 못하게 막는
2. selected : 초기 선택값
3. size : 박스 길이
4. multiple : 드래그해서 여러개 선택가능
📖기타 옵션들(성능)
disabled : 아예 막아놓는
readonly : 창은 떠있는데 사용자가 쓰지 못하게 하는
maxlength : 한 창에서 최대로 쓸수있는 숫자갯수
checked : checkbox에서 초기값으로 체크되서 나오는
placeholder : 기본값으로 보여줄 힌트
value : 이미 들어가 있는 값(지우고 다시입력)
🚨select박스에서 option value 속성은 서버에서 저장되는 값!🚨
✏️정리
<p></p> => 위아래로 줄바꿈효과 // block 한줄공간 다 차지
<q></q> => 문장단위인용(짧은) // inline 기본텍스트
<ul></ul> => unorder // <li></li> // ● ● ● 으로 목록 정리
<ol></ol> => order // <li></li> // 1.2.3. 으로 목록 정리
<dl></dl> => order // <dt></dt><dd></dd> // 중식-짜장면,짬뽕 분식-떡볶이,순대 로 목록정리
<a></a> => 링크 연결
// href 속성 : 연결할 사이트
// target 속성 : _blank(새탭에 띄우기) _self(현재페이지에 띄우기)
// title 속성 : 마우스 올려놨을때 정보가 뜨는
ex) <a href="https://comic.naver.com/index" target="_blank" title="네이버 웹툰으로...">
<img></img> => 이미지 띄우기
//src 속성 : 이미지 경로
(//alt 속성 : 이미지 설명 글씨)
ex) <img src="images/imgtest.jpg" alt="다운받은이미지">
<dive></dive> => 그룹 구분하기 // block 한줄공간 다차지
<span></span> => 그룹 구분하기 // inline 기본 텍스트
<strong></strong> => 진하게
<em></em> => 기울이기
💡
<form></form> => 입력양식
<label>제목</label> => 제목 클릭해도 창에 클릭한 효과
<input>
//type 속성 : text,password,checkbox,radio ....로 구분
💡
<fieldset></fieldset> => 창이 창을 감싸고 있는
<legend>ㅇㅇㅇ</legend> => 감싸고 있는 창 제목 ㅇㅇㅇ
<textarea></textarea> => 여러줄 쓸 수있는 텍스트 창
💡
<select></select> => select박스(위아래로 좌르륵 나오는창)
<option>
//value 속성 : 사용자한테 보이는 창 말고 서버에 저장되는 값
💡
<select></select> => select박스(위아래로 좌르륵 나오는창)
<optgroup></optgroup> => 좌르륵 나오는 창 소제목
<option>
//value 속성
select 박스 기능!
1. disabled : 비활성화
✔️2. selected : select박스에서 초기 선택값
(3. size : 박스 길이)
(4. multiple : 드래그해서 여러개 선택 가능)
기타 옵션들!
1. disabled : 비활성화
2. readonly : 사용자가 쓰지못하게 하는
3. maxlength : 최대로 쓸 수있는 숫자갯수
✔️4. checked : checkbox,radio에서 초기값으로 체크되서 나오는
5. placeholder : 연한회색으로 창에 아이디를 입력하세요. 아이디치면 사라지는 (힌트)
✔️6. value : text에서 초기값, 지우고 다시 쓰는
뒤죽박죽 벨로그