Question

我使用下面的脚本＆amp; CSS使用selectize插件使select按预期工作。一切都很好。

JS：

var COUNTRIES=[
{ code:"ch", name:"中文"},
     { code:"jp", name:"Japan"},
     { code:"kr", name:"Korea"},
     { code:"vn", name:"Vietnam"},
     { code:"uk", name:"United Kingdom"}
];


$('#country-selectize').selectize({
maxItems: 1,
labelField: 'name',
valueField: 'code',
plugins: ['remove_button'],
searchField: ['name', 'code'],
options: COUNTRIES,
preload: true,
persist: false,
render: {
    item: function(item, escape) {
        return "<div><img src='' class='flag flag-" + escape(item.code) + "' alt='flag' />&nbsp;" + escape(item.name) + "</div>";
    },
    option: function(item, escape) {
        return "<div><img src='' class='flag flag-" + escape(item.code) + "' alt='flag' />&nbsp;" + escape(item.name) + "</div>";
    }
},
});

我需要CSS帮助。不知道为什么我在图像周围获得1px边框颜色。我尝试以不同的方式删除，但它对我不起作用。

Answer 1

这是因为您正在使用带有source =“”的图片代码，这会导致带有图像替代文字的边框轮廓，即flag

因此请使用span而不是image标签

item: function(item, escape) {
    return "<div><span class='flag flag-" + escape(item.code) + "' />&nbsp;" + escape(item.name) + "</div>";
},
option: function(item, escape) {
    return "<div><span class='flag flag-" + escape(item.code) + "' />&nbsp;" + escape(item.name) + "</div>";
}

Updadated code

选择标志图像 - 边界CSS修复

1 个答案: