javascript - 如何让dojo按钮背景不可见或删除？

Question

我正在尝试用图像代替道场按钮。我可以添加图像作为背景，但是按钮的轮廓是可见的。我只想显示图像。我该怎么办？

我的代码如下。

CSS:

.EditButtonWidgetImage {
    background-image: url("EditButton/images/edit.png");
    background-position: center;
    background-repeat: no-repeat;
    height: 25px;
    width: 25px;
}

JavaScript:

var infoTableContainer = dojo.create("div", null, map.container);

    var x = 200 - map.position.x;
    var y = 50 - map.position.y;

    this.InfoTable = new FloatingPane({
        title : "<b>Editor</b>",
        resizable: true,
        doLayout: true,
        dockable: false,
        closable: true,
        //constrainToContainer: true,
        'class': "EditWidgetContainer",
        style: "left:"+x+"px;top:"+y+"px;padding:0px"
    }, infoTableContainer);
    //dojo.attr(infoTable, 'class', 'TableInfoWidgetContainer'); //ie8에서 class 예약어 처리로 인해 변경

    dojo.connect(this.InfoTable, 'close', lang.hitch(this, function() {
        //this.InfoTable.destroy();
        //console.log('infoGrid (infotable.destroy)=',this.InfoGrid);
        if (this.InfoGrid) {
            //this.InfoGrid.destroyRecursive(true);
            this.InfoGrid.destroy();
            this.InfoGrid = null;
            this.InfoGrid = undefined;
        }

        this.InfoTable = null;
        this.InfoTable = undefined;
    }));

    //Border생성
    var border = new BorderContainer({
        gutters: false,
        design: 'headline',
        style: "height:100%;width:100%;"
    })

    //검색옵션 생성
    var cpT = ContentPane({
        region: "top",
        title: "검색 옵션",
        style: "height:auto;width:100%;"
    });

    this.cboService = new ComboBox({
        title: '서비스 : ',
        searchAttr: "SVC_NM",
        style: "width:120px;"
    });

    this.cboLayer = new ComboBox({
        searchAttr: "LYR_NM",
        style: "width:120px;"
    });

    var btnResult = new Button({
        iconClass : "EditButtonWidgetImage",
        style: "width:40px;margin-left:4px;"
    });
    dojo.place('<label class="widget_field_label" style=width:70px; >편집대상 :&nbsp;</label>', cpT.domNode);
    cpT.addChild(this.cboService);
    dojo.place('<label class="widget_field_label" style=width:80px;>참조레이어 :&nbsp;</label>', cpT.domNode);
    cpT.addChild(this.cboLayer);
    cpT.addChild(btnResult);

    border.addChild(cpT);

    border.placeAt(this.InfoTable.containerNode);
    border.startup();

    this.InfoTable.startup();

Answer 1

如果您使用“dijit/form/Button”，只需包含以下类，您就会看到结果。

这里我重写了按钮类。确保将范围限制为仅特定按钮。

.claro .dijitButton .dijitButtonNode {
    background-color: transparent;
    border: none;
    box-shadow: none;
}