如何在表单中制作选择图像

cfr*_*nco 3 html forms select neat bourbon

我需要一个带有图像可选的表单,我在谷歌搜索过,我尝试使用选择选项,但这不起作用

你能给出解决这个问题的任何想法吗?

我正在使用波旁威士忌和整洁(SASS)

在此处输入图片说明

Ada*_*ith 6

我会将复选框制作成图像,请参阅小提琴https://jsfiddle.net/0c26tqd7/1/

编辑我在小提琴的选中复选框上添加了一个红色边框

html

<input type="checkbox" name='thing1' id="thing1"/><label for="thing1"></label>
Run Code Online (Sandbox Code Playgroud)

css

input[type=checkbox] {
    display:none;
}

input#thing1[type=checkbox] + label
{
    background-image: url("http://lorempixel.com/50/50/");
    height: 50px;
    width: 50px;
    display:inline-block;
    padding: 0 0 0 0px;
}
Run Code Online (Sandbox Code Playgroud)

  • 另外,还要注意一件事:如果 OP 想要一次一个选择,请更改为具有相同“名称”的单选按钮 (3认同)