android去掉button的边框,css中如何去掉button(按钮)的边框

博客介绍了在Android中去除按钮边框并添加新边框的方法。先去除旧边框,包括去除默认padding、间距、浮动影响、重叠边框及鼠标点击蓝框样式;再通过修改CSS默认设置,即可添加想要的新边框。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

用新的边框我们先要除去旧的边框才可以,然后再给他加上新边框,如下:

一,先除去:

1,看下默认样式效果,如图可以看到,默认padding和border,字体大小也是受浏览器默认指定

95c3e6b509d03f9f8a184cb247763086.png

8e010c8b94cc116d6fff2412a43c08e4.png

2,去除padding,指定一个字体大小,这里匹配了*表示所有元素,因为大部分的默认margin和padding都需要先去除,统一去除,后面需要再单独有针对性的添加

*{

margin: 0;

padding: 0;

font-size: 100%;

}

6a2e1d99316ac2e0f4254b5151325bf0.png

98a8369f9e5be9519b430cc3db373446.png

3,默认padding去除之后,按钮之间有间隙,这是inline-block默认的间距,用float来去除,并指定合适的宽和高

button{

float: left;

width: 60px;

height: 60px;

}

ae92ad71c7db79447dbf9ec06b651636.png

03932cf08ee128b76e47a3607704823d.png

4,间距去掉了,但都显示成一行了,这个是因为添加的浮动影响的,可以在div元素后面去除浮动

div:after{

content: "";

display: block;

clear: both;

}

56a6dd207502eccac43abdaee4bb7c3e.png

5,此时,可以看到边框重叠导致边框宽度不一致,需要自定义边框

border: 1px solid black;

margin-right: -1px;

margin-bottom: -1px;

7dfb77f1af055320005cfc47d47b10f0.png

f450c9897b80a6a4335245140e7e7add.png

6,从上面的图中,可以看到,在鼠标点击按钮的时候,会有蓝框选择的样式

加上outline: none;来去除

3d80552a078dcdf8208e7f2056ea33ae.png

二,再加上是使用如下的编程方法:

无标题文档

div{

width:200px; height:100px; border-bottom:1px solid #CCC;}

div1
div2

导致会出现边框的原因是CSS的默认设置,所以只要把这个默认设置改掉就可以了。然后就可以加上你想要的边框了哦!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值