멋쟁이 사자처럼 "프론트엔드 스쿨" 2일차
몇몇분들과 스터디를 시작했다.
이미지에 나와있는 것을 그대로 구현하는건데
input 태그를 3일 전에 공부해서 쉬울줄 알았다.
특히 정도를 나타내는 바(?)를 만드는 것 때문에 당황했다..!
<input type="range">
이렇게는 생각을 했는데 도대체 밑에 눈금을 어떻게 나타내는건지..!
구글링,,구글링,,,
<input type="range" list="tickmarks">
<datalist id="tickmarks">
<option value="0"></option>
<option value="10"></option>
<option value="20"></option>
<option value="30"></option>
<option value="40"></option>
<option value="50"></option>
<option value="60"></option>
<option value="70"></option>
<option value="80"></option>
<option value="90"></option>
<option value="100"></option>
</datalist>
밑에 표시는 tickmarks라고 하는 거였다..
또
submit버튼에 안에 내용물 바꾸려면 value값을 명시해줘야한다는 것을 알았다.
<input type="submit" value="제출하기">
그리고 input에서 type에 따라 value의 용도도 다르다는 것도!
button, submit은 버튼 내의 내용을 바꾸는 것.
password, text는 입력 필드의 초기값 설정 등..!
password 상자 안에 텍스트를 넣는 방법은 'placeholder'를 쓴다.
placeholder는 사전적인 의미는 "빠져 있는 다른 것을 대신하는 기호나 텍스트의 일부"인데
입력할 값에 대한 예시를 주거나, 힌트를 주는 기능이라고 한다.
<input type="password" placeholder="비밀번호를 입력하세요.">
접해보지 못했던 단어도 많지만 그래도 영어로 찾는 버릇을 들여보려고 한다...
많이 접해야 뭘로 검색할지 빨리 생각나겠지..?
이 스터디 말고 모각코도 한번 들어가봐야겠다..!