0

我有这个 Jquery 用户对话框:

    <!-- jQuery UI dialogs -->
    <div class="widget">    
        <div class="head"><h5 class="iAlert">jQuery UI dialogs</h5></div>
        <div class="body aligncenter">

            <div class="uDialog">
                <div id="dialog-message" title="Download complete">
                    <p><img src="images/icons/color/tick.png" alt="" class="icon" />Your files have downloaded successfully into the My Downloads folder.</p>
                    <p>Currently using <strong>36% of your storage space</strong></p>

                    <div class="uiForm">
                        <form action=""  class="mainForm">
                            <input type="text" value="http://" name="inputtext"/>
                            <input type="radio" name="question1" checked="checked" /><label>Selected radio</label>
                            <input type="radio" name="question1" /><label>Normal state</label>
                        </form>
                    </div>
                </div>
                <!-- Sample page content to illustrate the layering of the dialog -->
                <input type="button" value="Usual jQuery UI dialog" class="blueBtn" id="opener" />
            </div>

        </div>
    </div>

我想将输入从按钮更改为图像,如下所示:

<a href="#" title=""class="btn55 mr10"><img src="images/add.png" alt="" /><span>Add</span></a>

有一种方法?

4

2 回答 2

0

你能创造一个小提琴,所以我可以更精确吗?
这是一个链接jsfiddle.net/trajce/yhQeZ/
对于输入,您可以这样做:

/* this is general selector, if you want to target specific element, then add class or id*/
    input[type="button"]
    {
        width:120px;/*these are just some sample width and height*/
        height:30px;
        background: url('http://www.google.com/images/srpr/logo4w.png') center no-repeat;/*set your image as background of the input.*/
    }
于 2013-04-13T23:59:59.250 回答
0

小提琴中的示例

使用输入的类

.blueBtn {
    background-image: url('http://www.psdgraphics.com/wp-content/uploads/2009/07/push-button.jpg');
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
    height: 40px;
    width: 50px;
}

或与后台规则相结合

.blueBtn {
    background: url('http://www.psdgraphics.com/wp-content/uploads/2009/07/push-button.jpg')no-repeat center;
    background-size: 100% 100% ;
    height: 40px;
    width: 50px;
}
于 2013-04-14T00:52:47.840 回答