HTML로 양식 만들기. HTML로 드롭다운 목록을 만드는 방법은 무엇입니까? CSS 예제의 드롭다운 목록이 있는 양식

HTML 태그, 사이트의 HTML 양식 정의

우리는 인터넷에 웹사이트와 개별 페이지를 만듭니다.방문객들과 소통하기 위해

HTML 양식사이트 방문자 등록, 대화형 설문조사 및 투표, 메시지 보내기, 구매 등을 수행하는 데 사용됩니다. HTML이 양식은 소프트웨어 스크립트 또는 이메일을 통해 처리하기 위해 정보를 수집하고 이후에 전송하는 한 가지 목적으로 생성됩니다.

예제 HTML 양식 | 사이트를 입력하세요

태그, 속성 및 값

  • - 모양을 결정합니다.
  • name="" - 양식의 이름을 정의합니다.
  • method="" - 양식에서 데이터를 보내는 방법을 정의합니다. 값: "get" (기본값) 및 "post" . "포스트" 방법은 많은 양의 데이터를 전송할 수 있기 때문에 자주 사용됩니다.
  • action="" - 처리를 위해 데이터가 전송되는 URL을 정의합니다. 우리의 경우 - enter_data.php ..
  • - 데이터 입력을 위한 버튼, 스위치, 텍스트 필드와 같은 양식 요소를 정의합니다.
  • type="text" - 데이터 입력을 위한 텍스트 필드를 정의합니다.
  • type="password" - 별표 또는 원 형태로 텍스트가 표시되는 비밀번호 입력 필드를 정의합니다.
  • type="checkbox" - 라디오 버튼을 정의합니다.
  • type="hidden" - 숨겨진 양식 요소 정의 - 전송에 사용됨 추가 정보서버에.
  • size="25" - 텍스트 필드의 문자 길이입니다.
  • maxlength="30" - 입력할 수 있는 최대 문자 수입니다.
  • value="" - 라디오 버튼이나 스위치와 관련된 경우 처리를 위해 전송될 값을 정의합니다. 텍스트 필드나 버튼의 일부인 이 속성의 값은 예를 들어 위 예에서 Vasya 또는 Login으로 표시됩니다.

예제 HTML 양식 | 사이트에 대한 댓글

예제 HTML 양식




이름



우편










태그, 속성 및 값

  • action="http://site/comments.php" - 양식의 데이터가 전송될 URL을 정의합니다.
  • id="" - 양식 요소의 이름과 식별자를 정의합니다.
  • name="" - 양식 요소의 이름을 정의합니다.
  • - 양식의 일부로 텍스트 필드를 정의합니다.
  • cols="" - 양식 텍스트 필드의 열 수를 결정합니다.
  • Row="" - 양식 텍스트 필드의 행 수를 정의합니다.

사이에 있는 경우 텍스트를 배치하면 쉽게 제거할 수 있는 예로 필드 내부에 표시됩니다.

예제 HTML 양식 | 드롭 다운 목록

HTML 양식




태그, 속성 및 값

  • - 선택할 위치가 있는 목록을 정의합니다.
  • size="" - 표시되는 목록 위치의 수를 결정합니다. 값이 1이면 드롭다운 목록을 처리하는 것입니다.
  • - 목록의 위치(항목)를 결정합니다.
  • value="" - 처리를 위해 양식에서 지정된 URL로 전송되는 값을 포함합니다.
  • selected="selected" - 예시로 목록 항목을 강조 표시합니다.

예제 HTML 양식 | 스크롤 막대가 있는 목록

size="" 속성의 값을 늘리면 스크롤 막대가 있는 목록이 표시됩니다.

첫 번째 위치 두 번째 위치 세 번째 위치 네 번째 위치

HTML 양식




이 옵션의 경우 multiple="multiple" 플래그를 사용하면 여러 위치를 선택할 수 있습니다. 이 항목이 없으면 하나의 항목만 선택할 수 있습니다.

  • type="submit" - 버튼을 정의합니다.
  • type="reset" - 재설정 버튼을 정의합니다.
  • value="" - 버튼의 레이블을 정의합니다.
  • 추가로 참조하세요:

    사용자가 하나 이상을 선택할 수 있는 추천 항목 목록을 생성하도록 설계되었습니다. 태그로 제한됨 .

    태그 속성 ... 비활성화됨 목록에서 선택을 비활성화합니다. 값은 세 가지 방법으로 설정할 수 있습니다. multiple 여러 목록 항목을 동시에 선택할 수 있습니다. 다중 선택의 경우 하나의 양식에서 데이터 스트림에 동일한 이름을 가진 여러 변수가 있을 수 있습니다. 처리 프로그램은 이러한 상황을 예측하고 올바르게 처리해야 합니다. name 목록의 이름입니다. 필수 속성입니다. 필수 값이 비어 있지 않은 항목을 선택해야 합니다. 그렇지 않으면 브라우저에 메시지가 표시되고 양식이 서버로 전송되지 않습니다. 메시지의 모양과 내용은 브라우저에 따라 다르며 사용자가 변경할 수 없습니다(IE 및 Safari에서는 작동하지 않음). size 목록 상자의 세로 크기입니다. 해당 속성이 생략되거나 해당 값이 1이면 항목의 팝업 목록이 표시됩니다. 1보다 큰 숫자를 지정하면 목록 항목이 스크롤 막대가 있는 창에 표시됩니다. 속성 값이 실제 목록 항목 수보다 크면 빈 항목이 추가됩니다. 사용자가 이를 선택하면 빈 필드가 반환됩니다.

    목록 항목

    각 목록 항목은 태그로 제한됩니다. . 닫는 태그는 선택사항입니다.

    태그 속성
    비활성화됨 목록 항목 선택을 비활성화합니다. 레이블 목록 항목 레이블입니다. label 속성이 지정되면 태그 내부의 텍스트 대신 해당 값이 목록에 표시됩니다.

    다음은 PHP 스크립트를 사용하여 HTML 선택 옵션 값을 얻는 방법입니다.

    ". $_POST["selfphp"].""; } ?>

    양식이 GET 메소드를 지정하는 경우 다음을 사용하십시오. PHP 배열 $_GET[“”].

    CSS를 사용하여 드롭다운 목록 스타일 지정

    이제 드롭다운 목록 스타일을 정의하는 방법을 살펴보겠습니다.



    선택 요소 안에는 옵션 요소(목록 요소)가 있습니다. 각 옵션 요소에는 요소의 값을 저장하는 값 속성이 포함되어 있습니다. 그러나 옵션 요소의 값이 표시되는 텍스트와 일치할 필요는 없습니다. 예를 들어:

    selected 속성을 사용하면 기본 선택 요소를 설정할 수 있습니다. 목록의 첫 번째 요소일 필요는 없습니다.

    또 다른 속성인 비활성화(disabled)를 사용하면 특정 요소가 선택되는 것을 방지할 수 있습니다. 일반적으로 이 속성을 가진 요소는 제목을 만드는 데 사용됩니다.

    객관식 목록을 생성하려면 선택 요소에 다중 속성을 추가해야 합니다.

    HTML5에서 요소 선택




    Ctrl 키를 누르고 있으면 목록에서 여러 요소를 선택할 수 있습니다.

    Select를 사용하면 태그를 사용하여 요소를 그룹화할 수도 있습니다. :

    HTML5에서 요소 선택



    요소 그룹 사용은 드롭다운 목록과 다중 선택 목록 모두에 적용됩니다.



    
    맨 위