본문 바로가기
WEB/html & css

폼 관련 요소(FORM)3

by 일상코더 2022. 7. 7.

select

       - 선택 목록 상자 또는 콤보박스

       - <option>으로 각 항목을 나타냄

       - <option>속성으로는 selected가 있으며 이는 선택된 항목을 의미

 

textarea

       - 여러줄의 텍스트를 사용할때 사용

       - cols : 가로 크기를 조절하는 속성

       - rows : 세로 크기를 조절하는 속성

 

button
       - input 타입의 submit, reset, button과 모두 같은 기능을 가진 버튼

       - 차이점은 빈태그가 아니어서, 내용을 직접 넣을 수 있으므로 자유로운 스타일 표현가능

 

<!DOCTYPE html>
<html>
    <head>
        <meta charset = "utf-8">
        <meta name = "viewport" content = "initial-scale = 1.0">
        <title>select</title>
    </head>
    <body>
        <form>
            <input type ="text" placeholder = "아이디를 입력하세요"><br>
            <span>좋아하는 운동 : </span>
            <select>
                <option>축구</option>
                <option>야구</option>
                <option>농구</option>
            </select><br>
            <span>자기소개 : </span>
            <textarea cols="30" row="5" placeholder = "특기를 말씀해주세요"></textarea><br>
            <input type = "submit" value="전송"><br>
            <input type = "reset" value="취소">
            <button type = "submit">로그인</button>
        </form>
    </body>
</html>

 

 

'WEB > html & css' 카테고리의 다른 글

블록 & 인라인  (0) 2022.07.07
폼 관련 요소(FORM)4  (0) 2022.07.07
폼 관련 요소(FORM)2  (0) 2022.07.07
폼 관련 요소(FORM)  (0) 2022.07.07
표(TABLE) tag  (0) 2022.07.06

댓글