【问题标题】:How to make a select image in form如何在表单中制作选择图像
【发布时间】:2016-02-22 08:17:27
【问题描述】:

我需要一个带有可选图像的表单,我已经在 google 中搜索过,我尝试使用 select 选项,但这不起作用

请问您有什么办法解决这个问题吗?

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

【问题讨论】:

    标签: html forms select bourbon neat


    【解决方案1】:

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

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

    html

    <input type="checkbox" name='thing1' id="thing1"/><label for="thing1"></label>
    

    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;
    }
    

    【讨论】:

    • +1 好答案。另外,$('#thing1').css('background-image', 'url(image.ext)'); 可以帮助动态设置图像
    • 另外,还有一点需要注意:如果 OP 想要一次选择一个,请更改为具有相同 name 的单选按钮
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2014-05-03
    • 2023-03-10
    • 1970-01-01
    • 2012-09-26
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多