목록 표시하기

목록

연관 있는 항목을 나열한 것

순서 없는 목록 (Unordered List)

<ul>
	<li>빵</li>
    <li>떡볶이</li>
    <li>고기</li>
    <li>초밥</li>
</ul>

순서 있는 목록 (Ordered List)

<ol>
	<li>빵</li>
    <li>떡볶이</li>
    <li>고기</li>
    <li>초밥</li>
</ol>

순서가 없을 때는 ul / 순서가 있을 때는 ol / 항목을 표시하는 태그는 li

사심 가득한 리스트

입력 요소 만들기

input 태그

인라인 요소
단일 태그
입력창(값을 입력받을 수 있는 대화형 컨트롤/필드)

형태

<input />

type 속성

type 값에 따라서 입력 요소의 형태나 입력 데이터 유형이 달라진다.
기본값은 text이지만 약 20여 가지가 있다. 각 type에 따라서 사용되는 속성도 다르다.

name 속성

input 태그에 추가 할 수 있는 name 식별자
각 입력 항목에 대한 이름이다.
여러 태그를 구분하게 되면서 효율적인 작업이 가능해진다.

<input type = "text" name ="nickname"/>
<input type = "text" name ="job"/>

텍스트로 입력 받은 값을 순서대로 nickname, job이라는 이름을 부여해준다. 변수 느낌이랑 비슷해보인다.


사용자가 입력하기 전에 나타나는 안내 문구를 만들 수 있는 속성 placeholder

글자수를 제한하는 maxlength

버튼에 문구를 넣는 value

색을 고르는 것은 딱히 많이 쓰는 속성이 없다 그냥 텍스트로 안내 문구를 넣어주었다.

최대 바 수치를 나타내는 max 최소 바 수치를 나타내는 min
바를 움직일 때 증가하고 감소하는 단위를 나타내는 step


식별자도 넣어주기