본문 바로가기

HTML/HTML 기초

[HTML] input 기타 type 알아보기

<!-- 여러 줄의 텍스트를 입력하는 태그 -->

 <textarea name="name" rows="5" cols="30">

 

<!-- progress 진행 상태 보여주기 -->

<progress value="10" max="60">

<progress value="30" max="100">

 

<!-- meter 값의 크기를 표시하는 태그, 최대, 최솟값을 지정하지 않으면 min=0, max=1 -->

<meter value="0.2">

<meter value="64" min="0" max="100">

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>기타 입력 태그</title>
</head>
<body>
    <!-- 여러 줄의 텍스트를 입력하는 태그 -->
    <form>
        <textarea name="name" rows="5" cols="30">의견을 남겨 주세요.</textarea><br><br>
        <!-- progress 진행 상태 보여주기 -->
        <label>10초 남음</label>
        <progress value="10" max="60"></progress><br>
        <label>진행률 : 30%</label>
        <progress value="30" max="100"></progress><br><br>
        <!-- meter 값의 크기를 표시하는 태그
        최대, 최솟값을 지정하지 않으면 min=0, max=1 -->
        <label>점유율 : </label>
        <meter value="0.2"></meter><br>
        <label>사용량 :</label>
        <meter value="64" min="0" max="100"></meter>
    </form>
</body>
</html>

 

 

728x90
반응형

'HTML > HTML 기초' 카테고리의 다른 글

[HTML] section과 aside 부분  (0) 2020.07.29
[HTML] header부분  (0) 2020.07.29
[HTML] select 사용해보기  (2) 2020.07.28
[HTML] input, output 사용해보기  (0) 2020.07.28
[HTML] 전체 style 지정해보기  (0) 2020.07.28