将标签的type属性值设置为"color"即可创建一个拾色器。
拾色器功能是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``>
特别说明:name属性是必须的，否则后台无法接收提交的表单数据。
此控件还有其他属性，下面分别做一下介绍:
（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``>
通过value属性设置控件默认选取的颜色值。
<!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``>
通过autofocus属性设置控件加载完毕后自动获取焦点。
<!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``>
form属性引用所属表单的id，于是，虽然控件在之外，但依然是该表单的一部分。
最后，给大家推荐一个前端学习进阶内推交流群685910553（前端资料分享），不管你在地球哪个方位，
不管你参加工作几年都欢迎你的入驻！（群内会定期免费提供一些群主收藏的免费学习书籍资料以及整理好的面试题和答案文档！）
如果您对这个文章有任何异议，那么请在文章评论处写上你的评论。
如果您觉得这个文章有意思，那么请分享并转发，或者也可以关注一下表示您对我们文章的认可与鼓励。
愿大家都能在编程这条路，越走越远。