HTML에서 선택 태그를 사용하는 방법-HTML 튜토리얼-php.cn

HTML에서 선택 태그를 사용하는 방법

不言

풀어 주다： 2018-11-23 09:51:34

원래의

12388명이 탐색했습니다.

HTML의 선택 태그를 사용하면 양식의 항목에 공개 선택 상자를 만들 수 있습니다. 이 글에서는 선택 태그의 사용법을 자세히 소개합니다.

먼저 선택태그가 무엇인지 살펴볼까요?

select 태그는 선택 상자를 만드는 데 사용되는 태그입니다. 사용자가 드롭다운 메뉴 항목에서 선택하도록 하려면 선택 태그를 사용하세요.

선택 태그를 양식의 일부로 사용하거나 JavaScript를 사용하여 선택한 항목의 값을 가져올 수 있습니다.

선택 태그는 어떻게 사용하나요?

선택 태그를 사용하려면 선택 태그 사이에 옵션 태그를 추가하여 드롭다운 메뉴를 생성하면 됩니다.

<select name="name" id="name">
  <option value="name1">张三</option>
  <option value="name2">李四</option>
  <option value="name3">王二</option>
</select>

로그인 후 복사

선택 태그의 복잡한 사용법

코드 예:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
	<title></title>
</head>
<body>
<label>php中文网视频课程选择：
  <select name="program" multiple size="4">
    <optgroup label="application">
      <option value="wordpress">前端视频课程</option>
      <option value="webapp">php视频教程</option>
      <option value="laravel">bootstrap视频课程</option>
    </optgroup>
    <optgroup label="mobile">
      <option value="iphone">iPhone</option>
      <option value="android">Android</option>
      <option value="unity">Unity</option>
    </optgroup>
  </select>
</label>
</body>
</html>

로그인 후 복사

지침:

여러 속성을 지정하는 경우 여러 옵션을 사용할 수 있습니다. 지정하지 않으면 하나만 선택됩니다.

size 속성이 size="4"로 지정되어 있으므로 4줄만 표시할 수 있습니다.

모든 옵션을 스크롤할 수도 있습니다.

으로 지정된 태그 자체는 선택할 수 없지만 그룹 태그로 표시될 수 있습니다.

마지막 예를 살펴보겠습니다.

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
  </head>
  <body>
    <form action="#" method="GET">
      <select name="name" id="name">
        <option value="who">发消息给谁？</option>
        <option value="name1">张三</option>
        <option value="name2">李四</option>
        <option value="name3">王二</option>
        <option value="name4">陈五</option>
        <option value="name5">赵六</option>
      </select>
      <input type="submit" name="submit" value="发送" />
    </form>
  </body>
</html>

로그인 후 복사

브라우저에 미치는 영향은 다음과 같습니다.

HTML에서 선택 태그를 사용하는 방법