方法和详细的操作步骤如下:
1、第一步,打开软件并创建一些默认复选框,见下图,转到下面的步骤。
2、第二步,执行完上面的操作之后,在顶部样式标签上设置输入样式,将输入的显示属性设置为none,删除默认的单选框,然后设置每个单选框的边距,见下图,转到下面的步骤。
3、第三步,执行完上面的操作之后,继续设置下面的样式,设置“label”标签的伪元素before和after,然后将原始复选框更改为状态属性,“
checked + label”设置为红色的实心框,并取消选中状态,“ label :: after”为白色空心框,见下图,转到下面的步骤。
4、第四步,执行完上面的操作之后,打开浏览器,可以看到设置的样式,去掉了默认样式,见下图。这样,就解决了这个问题了。
代码如下:
.button{border:0px;background-color:transparent;background-image:url(你自定义背景图片的位置.png);}
虽然这个问题很老了,但还是想回答完善一下答案,好帮助更多的人!
简单说明一下:去除button默认样式,就是替换老样式,将边框设置为0px;将背景色调为透明,最后用背景图片将其替代即可,适合png或者gif等透明图片样式,如果背景图是jpg的,那么背景色透不透明都无关紧要。凡是说用none的,我也尝试了,貌似没用。
可以用图片覆盖或者直接用图片代替,一般都是美工做的好看的图片直接附上去的,再设置它的点击事件就可以了
css中写 style="border:0;"
设置border:0和background-color:none就没了