border:none;以及border:0;的区别！

最新推荐文章于 2022-04-07 21:17:38 发布
最新推荐文章于 2022-04-07 21:17:38 发布
阅读量665 收藏 2
点赞数 4
分类专栏： HTML CSS 文章标签： 前端 html css 网站
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44253336/article/details/96467340
版权

无边框用border:none还是border:0一直都是一个热议的问题，两者除了在渲染性能上面的差别以外，在标准浏览器中页面表现是没有任何差别的。

border:none表示边框样式无
border:0表示边框宽度为0

当然将对象的的边框设置border:0和border:none的效果都是是一样的，都可以将边框取消掉。

border:0可以将边框的宽度设置为零，尽管视觉上看不到了，但是浏览器还是会渲染的，
border:none直接是没有边框，浏览器不会去渲染。

所以说设置为none执行效果稍高一些，当然这个差距基本忽略不计。==
Poetry Code
关注
  • 4
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
border:none与border:0的区别
lryh_的博客
01-27 2294
border:none与border:0的区别
border:0、border:none、border:0 none三者之间的区别
winkexin的博客
05-18 907
因为浏览器是先解析自身的默认CSS，再解析开发者书写的CSS，所以当有border-width或border-color设置的时候才会令IE6、去解析border-style:none;把border的边框设为0像素，虽然在页面上看不到，但按border默认值理解，浏览器依然对border-width/border-color进行了渲染，即已经占用了内存值。与border:none;在IE6和IE7中，将border设成0和将border设成none对于input标签和button标签是不一样的。
CSS中设置border属性为0与none的区别
热门推荐
路漫漫~
05-12 5万+
在我们设置CSS的时候，对标签元素不设置边框属性或者取消边框属性一般设置为：border:none;或border:0;两种方法均可。 border:none;与border:0;的区别体现有两点：一是理论上的性能差异；二是浏览器兼容性的差异。 1.性能差异 【border:0;】把border设为“0”像素虽然在页面上看不见，但按border默认值理解，浏览器依然对bord
"border:0"与"border:none"的区别
clear_love8的博客
03-16 5422
"border:0"与"border:none"的差异主要体现在性能差异和兼容差异。 1.性能差异 "border:0"表示把border定义为0px。虽然0px在页面上看不到，但浏览器会对border进行渲染，结果会得到一个0px的border。 "border:none"表示把border定义为“无”，浏览器不会渲染它。 简单来说："border:0"需要占用内存，而"border:none&q
HTML img 设置border: none; 仍显示边框
soindy
05-09 9350
上图所示,设置了border: none 仍然有边框,这是因为设置了height 和 weight, 去掉即可. 原理稍后研究~
border:none与border:0使用区别
10-26
在CSS中，`border:none` 和 `border:0` 都常用来实现元素无边框的效果，但它们之间存在细微的差异，尤其是在不同浏览器的解析和渲染性能上。以下是这两个属性的详细解释和使用场景： 1. **border:none** `border:...
css中border:none;与border:0;的区别说明
09-25
在CSS中，`border:none;` 和 `border:0;` 都用于移除元素的边框，但它们之间存在一些微妙的区别。首先，我们来深入理解这两个声明的理论性能差异。 1. 性能差异： - `border:0;` 当设置边框为0像素时，虽然在视觉...
IE里button设置border:none属性无效解决方法
10-26
通常，`border:none` 应该等同于`border-width:0`, `border-style:none`, 和 `border-color:transparent`，但在IE6和IE7中，它仅仅相当于`border-style:none`。这意味着即使边框样式被清除，边框所占用的空间仍然...
ie9崩溃现象当js设置tr元素样式为display:none
12-13
在IE9浏览器中，当你尝试使用JavaScript来设置`<tr>`元素的CSS样式为`display:none`时，可能会遇到浏览器崩溃的问题。这个问题主要是由于IE9对表格元素（如`<tr>`、`<td>`等）处理方式的特定缺陷引起的。在IE9中，...
border:none;与border:0;的区别
weixin_30587927的博客
09-09 139
border:none表示边框样式无,border:0表示边框宽度为0;当定义了border:none,即隐藏了边框的显示,实际就是边框宽度为0.当定义边框时,必须定义边框的显示样式.因为边框默认样式为不显示none,所以仅设置边框宽度,由于样式不存在,边框的宽度也自动被设置为0. 转载于:https://www.cnblogs.com/wjj5728/p/5855960.html...
前端学习日志 Day6 盒子模型
qq_51068622的博客
04-07 403
盒模型、盒子模型、框模型(box model) -cSS将页面中的所有元素都设置为了一个矩形的盒子 将元素设置为矩形的盒子后，对页面的布局就变成将不同的盒子摆放到不同的位置。每一个盒子都由以下几个部分组成: 内容区(content) 内边距(padding) 边框(border) 外边距(margin) 内容区(content)：元素中的所有的子元素和文本内容都在内容区中排列 内容区的大小由width 和 height两个属性来设置width 设置内容区的宽度height 设置内容区的高..
牛客网错题集--HTML、CSS试题(4)
CXYyyh666的博客
08-25 1040
牛客网错题集--HTML、CSS试题--4第1题第2题第3题第4题 第1题 1.在 HTML 音频/视频 DOM 中，_____设置或返回音频/视频播放的默认速度？() A.currentTime B.duration C.defaultPlaybackRate D.playbackRate 答案：C 解析： 1.currentTime:设置或者返回视频播放的当前位置（以秒计）。当设置该属性时，播放会跳跃到指定的位置。 2.duration:规定造成过渡效果需要花费的时间 。 3.defaultPlayba
CSS中border:0与border:none的区别
程麒阁的博客
07-19 386
面试题 请你谈一谈，CSS中border:0和border:none的区别 标准回答 首先我们从浏览器渲染和浏览器兼容两方面来谈 浏览器渲染 border:0 设置border宽度是0，但是浏览器还是会渲染border这个属性 border:none 不设置border属性，浏览器渲染时候，直接忽略边框属性 浏览器兼容 其实这个面试问题来源于，IE浏览器的兼容。早期的IE浏览器，是不支持border:none这个属性的，所以当时只能使用border:0来让边框隐藏掉，浏览器兼容时候写border:none的
【转载】border:none;与border:0;的区别
weixin_34032779的博客
09-14 103
　　1.性能差异 　　【border:0;】把border设为“0”像素虽然在页面上看不见，但按border默认值理解，浏览器依然对border-width/border-color进行了渲染，即已经占用了内存值。 　　【border:none;】把border设为“none”即没有，浏览器解析“none”时将不作出渲染动作，即不会消耗内存值。 　　2.兼容性差异 　　兼容性差异只针对浏览...
border:0;和border:none;的区别
hardgirls的博客
06-25 4361
感觉它和display:none;与visibility:hidden;的关系类似；   而对于border属性的渲染性能对比暂时没找测试的方法，虽然认为他们存在渲染性能上的差异但也只能说是理论上。   1.性能差异 对比border:0;与border:none;之间的区别在于有渲染和没渲染； 【border:0;】把CSS中的border设为“0”像素虽然在
项目问题1："border:none"与"border:0px"有什么区别呢？
zxy9602的博客
04-10 2692
1、其实，从大体上讲，border:none;与border:0的区别体现有两点： （1）理论上的性能差异 （2）浏览器兼容性的差异 性能差异—— a、“border:0px”中，把border设为“0”，虽然页面上看不见，但是如果按照border默认值来理解，浏览器依然对border-width/border-color进行了渲染，即已占用了内存值。 b、“border:none”中，
border：0;和border：none;的区别
乔的博客
05-12 2194
一是理论上的性能差异；二是浏览器兼容性的差异。 性能差异： 【border:0;】把border设为“0”像素虽然在页面上看不见，但按border默认值理解，浏览器依然对border-width/border-color进行了渲染，即已经占用了内存值。 【border:none;】把border设为“none”即没有，浏览器解析“none”时将不作出渲染动作，即不会消耗内存值。 兼容性差异： 兼容...
border:none与border:0的效果以及二者的区别
weixin_45184627的博客
07-15 584
1.效果 border-style:none;//无边框 border-width:0;//边框宽度为0px 2.区别 （1）性能差异 border:0;浏览器对border-width、border-color进行渲染，占用内存。 border:none;浏览器不进行渲染，不占用内存。 Chrome： border:none;>> border:initial none initial; border:0;>> border:0 initial initial ; Firefox
border:none跟border:0的区别
最新发布
06-10
`border:none` 和 `border:0` 都可以用来设置元素的边框样式，它们的区别在于值的类型和含义略有不同。 `border:none` 表示不设置任何边框，可以看作是取消元素原有的边框，这个值是一个关键字，表示不设置边框。 ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值