怎么在html添加颜色选择框,HTML颜色选择器输入

以下是我最终使用的内容：

$("input.color").each(function() {

var that = this;

$(this).parent().prepend($("").click(function() {

that.type = (that.type == "color") ? "text" : "color";

}));

}).change(function() {

$(this).attr("data-value",this.value);

this.type = "text";

});

label {

font-family: sans-serif;

width: 300px;

display: block;

position: relative;

}

input {

padding: 5px 15px;

font-size: 16px;

width: 100%;

box-sizing: border-box;

}

input[type=color] {

padding: 0;

border: 0;

height: 40px;

}

input[type=color]:after {

content: attr(data-value);

position: absolute;

bottom: 10px;

text-align: center;

color: #fffff5;

display: block;

width: 100%;

}

.color-icon {

position: absolute;

bottom: 10px;

right: 10px;

color: #666;

}

Color: