Question

我有一个带有嵌套选项标签的select标签。我想用它来显示图像，但是图像没有显示。我不明白select标签的工作原理吗？

<select multiple="multiple" class="image-picker masonry" id="image_picker" style="width: 10000px; height: 10000px;">
        <option class="masonryitem brick" img src="/Images/Image1.jpg" width="180" height="180" alt="">
        </option>

        <option class="masonryitem brick" img src="/Images/Image2.jpg" width="180" height="270" alt="" >
        </option>
    </select>

我想让图片使用image-picker，以便可以选择

Answer 1

<强> HTML

<select multiple="multiple" class="image-picker masonry" id="image_picker" style="width: 10000px; height: 10000px;">
        <option class="masonryitem brick" alt="">one
        </option>
        <option class="masonryitem brick"  alt="" >two
        </option>
    </select>

<强> CSS

select#image_picker option[value="one"]   { background-image:url(/Images/Image1.jpg);   }
select#image_picker option[value="two"] { background-image:url(/Images/Image2.jpg); }

Answer 2

文件明确指出：

只需将属性data-img-src添加到您要用作预览的图像的网址

在选择标签上显示图像

2 个答案: