border:0和border:none的区别是什么

border:0和border:none的区别是什么:
将对象的的边框设置border:0和border:none的效果是一样的,都可以将边框取消,代码实例如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.51texiao.cn/" />
<title>蚂蚁部落</title>
<style type="text/css">
div
{
  width:200px;
  height:200px;
  border:2px solid red;
  border-bottom:none;
  border-left:0;
}
</style>
</head>
<body>
<div></div>
</body>
</html>

以上代码的运行可以看出,通过将边框设置为0或者none都可以取消边框,从外观上两者是一样的,但是还是有很大不同。border:0可以将边框的宽度设置为零,尽管视觉上看不到了,但是浏览器还是会渲染的,border:none直接是没有边框,浏览器不会去渲染。所以说设置为none执行效果稍高一些,当然这个差距基本忽略不计。

原文地址是:http://www.51texiao.cn/div_cssjiaocheng/2015/0501/508.html

时间: 2024-10-23 18:09:53

border:0和border:none的区别是什么的相关文章

border:0跟border:none;之间的区别

两个之间的区别:①理论上border:none的时候对于border的样式例如:border,border-color,border-img等都不再渲染,即不占内存,但是border:0的时候依然占用内存,这个没办法展示,就是理论上而已,所以尽量使用border:none:②但是,当使用border:none的时候,对于最新的浏览器这两个在表象上是没有什么区别的,但是别忘了,还有万恶的  IE6,此时input跟button在IE6中会依然显示边框.解决办法是:添加背景,例如:背景颜色就可以消失

border:0; VS border:none;

border:none与border:0的区别体现为两点:一是理论上的性能差异,二是浏览器兼容性的差异. 性能差异: [border:0;]把border设为“0”像素效果等于border-width:0,浏览器依然对border-width.border-color进行了渲染,即已经占用了内存值. [border:none;]把border设为“none”,实际效果等同于border-style:none,浏览器解析“none”时将不作出渲染动作,即不会消耗内存值. 兼容性差异: IE6.IE

border:0与border:none区别与联系

联系:前台效果均实现了无边框 区别: 要解释区别,首先得先介绍一下border这个属性. border是一个简写属性.可以设置如下属性 border-width border-style border-color 平时写的时候不用写齐三个属性,写其中一两个也是允许的,比如 border: 1px solid; 为什么这样是可行的呢,因为这样写,浏览器会设置这个缺少属性的默认值.过程等价于(伪代码) border-width: 1px; border-style: solid; border-co

border:0和border:none

相同:边框不显示区别:border:0; 被解析为 border-width:0; 表示边框宽度为0.border:none; 被解析为 border-style:none; 表示边框样式无.border:none;的性能要比border:0;高.IE7不支持border:none; 为了少渲染border-width:0,和不占用内存,这里我们写一个兼容所有浏览器的最优写法:border:0 none:前面的0是针对ie6和ie7的兼容,后面的none是针对标准浏览器的.

border:0跟border:none的区别

border:0;视觉上看不见,但是浏览器对其border-width,border-color进行了渲染,占用了内存值; border:none;不对其进行渲染; 这是性能差异; 下面看看浏览器兼容性差异; 只针对ie6,7的input,button标签; 在ie上使用border:none,边框依旧存在,使用border:0;边框就不存在, 但是性能没有border:none使用起来性能好,我们可以使用border:none,然后设置背景属性就好了. 原文地址:https://www.cnb

border:none;与border:0;的区别

这问题在网络相信已经有不少人问到,最近再次被牵起讨论,籍此记录一下个人的理解,border:none;与border:0;的区别体现有两点: 一是理论上的性能差异二是浏览器兼容性的差异.1.性能差异 [border:0;]把border设为"0"像素虽然在页面上看不见,但按border默认值理解, 浏览器依然对border-width/border-color进行了渲染,即已经占用了内存值. [border:none;]把border设为"none"即没有,浏览器解

CSS中设置border:none和border:0的区别

在我们设置CSS的时候,对标签元素不设置边框属性或者取消边框属性一般设置为:border:none;或border:0;两种方法均可. border:none;与border:0;的区别体现有两点:一是理论上的性能差异:二是浏览器兼容性的差异. 1.性能差异 [border:0;]把border设为"0"像素虽然在页面上看不见,但按border默认值理解,浏览器依然对border-width/border-color进行了渲染,即已经占用了内存值.[border:none;]把bord

html,body { margin:0; padding:0;border:0}

body,html /* 设置窗口DIV为浏览器大小*/ { margin:0; padding:0; height:100%; } 下面代码 <!DOCTYPE html> <html lang="en"> <head> <style> #side{ float:left; width: 30%; height: 300px; background-color: #99FF99; } #main{ margin-left:30%; wi

border:none与border:0的区别

border:none与border:0的区别体现为两点:一是理论上的性能差异,二是浏览器兼容性的差异. 性能差异: [border:0;]把border设为"0"像素效果等于border-width:0,浏览器依然对border-width.border-color进行了渲染,即已经占用了内存值. [border:none;]把border设为"none",实际效果等同于border-style:none,浏览器解析"none"时将不作出渲染动