기본 프론트 엔드 (11) 입력 색 색상 선택기

태그의 type 속성의 값은 "색"색상 선택기를 생성하도록 설정되어 있습니다.

색상 선택기 HTML5 기능이 추가됩니다.

<!DOCTYPE html>

<``html``>

<``head``>

<``meta charset``=``" utf-8"``>

<``meta name``=``"author" content``=``"[http://www.softdewhy.com/](http://www.softdewhy.com/)" />

<``title``>兴趣部落</``title``>

</``head``>

<``body``>

<``form name``=``"myform" method``=``"post" action``=``"do.php"``>

选择颜色:<``input type``=``"color" name``=``"color"``/>

</``form``>

</``body``>

</``html``>

특별 참고 사항 : 이름 속성이 다른 배경이 양식 데이터 제출을받을 수 없습니다 필요합니다.

이 컨트롤은 다른 속성, 다음과 같은 몇 가지 소개 작업을 수행하는 :

(1) .value : 기본값 색상 선택을 제어하는데 사용될 설정.

(2) .form (HTML5), 하나 개 이상의 입력 필드가 속하는 형성 지정.

(3) .autofocus (HTML5) : 페이지가로드, 도메인이 자동으로 초점을 맞출 때 지정된.

(4) .disabled : 제어 상태를 설정하는 것은 불가능하다.

코드 예제 :

<!DOCTYPE html>

<``html``>

<``head``>

<``meta charset``=``" utf-8"``>

<``meta name``=``"author" content``=``"[http://www.softdewhy.com/](http://www.softdewhy.com/)" />

<``title``>兴趣部落</``title``>

</``head``>

<``body``>

<``form name``=``"myform" method``=``"post" action``=``"do.php"``>

选择颜色:<``input type``=``"color" value``=``"#00ffff" name``=``"color"``/>

</``form``>

</``body``>

</``html``>

기본 색상 값이 제어 값 속성을 설정하여 선택.

<!DOCTYPE html>

<``html``>

<``head``>

<``meta charset``=``" utf-8"``>

<``meta name``=``"author" content``=``"[http://www.softdewhy.com/](http://www.softwdehy.com/)" />

<``title``>兴趣部落</``title``>

</``head``>

<``body``>

<``form name``=``"myform" method``=``"post" action``=``"do.php"``>

选择颜色:<``input type``=``"color" autofocus name``=``"color"``/>

<``input type``=``"submit" value``=``"提交表单"``>

</``form``>

</``body``>

</``html``>

오토 포커스 컨트롤의 속성에 의해로드 된 후에 자동으로 포커스를 취득.

<!DOCTYPE html>

<``html``>

<``head``>

<``meta charset``=``" utf-8"``>

<``meta name``=``"author" content``=``"[http://www.softdewhy.com/](http://www.softdewhy.com/)" />

<``title``>兴趣部落</``title``>

</``head``>

<``body``>

<``form name``=``"myform" method``=``"post" action``=``"do.php"``>

选择颜色:<``input type``=``"color" disabled name``=``"color"``/>

<``input type``=``"submit" value``=``"提交表单"``>

</``form``>

</``body``>

</``html``>

사용할 수없는 상태로 색상 제어, 색상 값이 제출되지 않습니다.

<!DOCTYPE html>

<``html``>

<``head``>

<``meta charset``=``" utf-8"``>

<``meta name``=``"author" content``=``"[http://www.softwhy.com/](http://www.softwhy.com/)" />

<``title``>蚂蚁部落</``title``>

</``head``>

<``body``>

<``form name``=``"myform" id``=``"ant" method``=``"post" action``=``"do.php"``>

<``input type``=``"submit" value``=``"提交表单"``>

</``form``>

选择颜色:<``input type``=``"color" form``=``"ant" name``=``"color"``/>

</``body``>

</``html``>

형상은 여전히 ​​형태의 일부를 참조 번호 형태 소유자 속성 때문에, 컨트롤하지만 이외에 있지만.

마지막으로, 나는 추천 프런트 엔드 학습 교환기 685 910 553 고급에 푸시 ( 프런트 엔드 정보 공유 ), 상관없이 당신이 지구에있는 어느 방향으로
당신은 당신이에 정착 몇 년 동안 작업에 오신 것을 환영합니다 여부를! (그룹 내에서 정기적으로 무료 학습 자료 및 얼굴 질문과 답변 문서 정돈 책의 주요 그룹의 일부의 무료 모음을 제공합니다!)
여기에 그림 삽입 설명

이 문서에 이의가있는 경우 문서에 코멘트에, 당신의 의견을 적어주세요.

이 문서가 흥미 경우, 공유 및 전달, 또는 당신이 볼 수하십시오, 당신은 인정하고 우리의 기사의 격려.

멀리 멀리 프로그래밍의 모든 사람이 도로를 바랍니다.

추천

출처blog.csdn.net/fenghulun/article/details/91471847