0

I have created CSS button from this site cssportal.com but after adding to my site I am getting different from original created. Why I am getting border from left and top.

Original View:

enter image description here

but currently I am getting this:

enter image description here

My Fiddle: Sample

4

5 回答 5

1

您忘记了删除原始浏览器边框：http: //jsfiddle.net/xm73g/2/

( border: 0px;)

于 2013-11-08T08:39:53.920 回答
1

JsFiddle 演示

它是按钮的基本样式，因为按钮就像你的光标按下它，然后又回到原来的位置。

请添加border:none;到您的按钮样式。

于 2013-11-08T08:39:54.443 回答
1

给border: 0;CSS 一个...

预习

正常和悬停版本：

小提琴：http: //jsfiddle.net/xm73g/3/

.wpcf7-submit {
    font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: bold;
    color: #FFFFFF !important;
    font-size: 15px;
    text-shadow: 1px 1px 0px #3498DB;
    text-transform:uppercase;
    padding: 10px 40px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    border: 0;
    background: #3498DB;
    background: linear-gradient(top, #3498DB, #3498DB);
    background: -ms-linear-gradient(top, #3498DB, #3498DB);
    background: -webkit-gradient(linear, left top, left bottom, from(#3498DB), to(#3498DB));
    background: -moz-linear-gradient(top, #3498DB, #3498DB);
}
于 2013-11-08T08:41:07.990 回答
0

将border：0也放在按钮上，它会起作用

于 2013-11-08T08:40:53.463 回答
0

添加边框：无；在这样的css代码中：

.wpcf7-submit {
    font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: bold;
    border:none;
    color: #FFFFFF !important;
    font-size: 15px;
    text-shadow: 1px 1px 0px #3498DB;
    text-transform:uppercase;
    padding: 10px 40px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    background: #3498DB;
    background: linear-gradient(top, #3498DB, #3498DB);
    background: -ms-linear-gradient(top, #3498DB, #3498DB);
    background: -webkit-gradient(linear, left top, left bottom, from(#3498DB), to(#3498DB));
    background: -moz-linear-gradient(top, #3498DB, #3498DB);
}
.wpcf7-submit:hover {
    color: #FFFFFF !important;
    border:none;
    background: #468CCF;
    background: linear-gradient(top, #468CCF, #63B8EE);
    background: -ms-linear-gradient(top, #468CCF, #63B8EE);
    background: -webkit-gradient(linear, left top, left bottom, from(#468CCF), to(#63B8EE));
    background: -moz-linear-gradient(top, #468CCF, #63B8EE);
}
于 2013-11-08T08:50:21.943 回答