border:none与border:0的区别体现为两点:一是理论上的性能差异,二是浏览器兼容性的差异。

性能差异:

【border:0;】把border设为“0”像素效果等于border-width:0,浏览器依然对border-width、border-color进行了渲染,即已经占用了内存值。

【border:none;】把border设为“none”,实际效果等同于border-style:none,浏览器解析“none”时将不作出渲染动作,即不会消耗内存值。

兼容性差异:

IE6、IE7中,border为“none”时,标签button、input边框依然存在。

解决方法:

1,input,button{border:none;background:none;} 据说这种方法理论上没有性能消耗,添加background来实现兼容,难道不需要占用内存???

2,input,button{border:0 none;} 个人觉得这种方法相较于第一种通过background实现兼容的方法要好

3,input,button{border:0;}这种方法字符最少,大项目中节省的流量啊,而且我觉得这个内存消耗神马滴可以通过其他页面优化来弥补。

border:0; VS border:none;的更多相关文章

  1. 简单告诉你-"border:0"与"border:none"的区别

    "border:0"与"border:none"的差异主要体现在性能差异和兼容差异.1.性能差异"border:0"表示把border定义为 ...

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

    联系:前台效果均实现了无边框 区别: 要解释区别,首先得先介绍一下border这个属性. border是一个简写属性.可以设置如下属性 border-width border-style border ...

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

    在我们设置CSS的时候,对标签元素不设置边框属性或者取消边框属性一般设置为:border:none;或border:0;两种方法均可. border:none;与border:0;的区别体现有两点:一 ...

  4. border:none;和border:0;的区别

    一.是理论上的性能差异 [border:0;]把border设为“0”像素虽然在页面上看不见,但按border默认值理解,浏览器依然对border-width/border-color进行了渲染,即已 ...

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

    border:none表示边框样式无,border:0表示边框宽度为0;当定义了border:none,即隐藏了边框的显示,实际就是边框宽度为0. 当定义边框时,必须定义边框的显示样式.因为边框默认样 ...

  6. 移动端页面0.5px border的实现

    移动端上经常发现1px边框异常的粗,因此,决定用伪类配合css3来实现0.5px边框 代码如下: <!doctype html> <html lang="en"& ...

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

    body,html /* 设置窗口DIV为浏览器大小*/ { margin:; padding:; height:100%; } 下面代码 <!DOCTYPE html> <html ...

  8. 移动端安卓手机不能识别border 0.5px解决方案

    由于安卓手机无法识别border 0.5px,因此我们要用0.5px的话必须要借助css3中的-webkit-transform:scale缩放来实现, 原理:将伪元素的宽设为200%,height设 ...

  9. border:none和border:0的区别

    C:当定义border:none时,表示无边框样式,浏览器并不会对边框进行渲染,也就没有实际的宽度:  D:定义边框时,除了设置宽度外,还必须设置边框的样式才能显示出来.     border:0;浏 ...

随机推荐

  1. ArcGIS Javascript 异常之No 'Access-Control-Allow-Origin' header

    本文只描述现象与处理措施,不讨论原理. 开发过程中遇到此异常,查询后网上说是跨域访问的问题,给出的解决方案是通过JQuery的跨域访问机制来解决, 难道我需要直接找ArcGISTiledMapServ ...

  2. Android中layout_gravity和gravity的区别

    安卓中的 layout_gravity 属性和 gravity属性 有啥区别? LinearLayout有两个非常相似的属性: android:gravity与android:layout_gravi ...

  3. php——用for循环打印半金字塔、金字塔、正方形、倒金字塔、菱形、空心图形等

    1.半金字塔 $n=5; //控制层数 for($i=1;$i<=$n;$i++){ //控制每层的 “*” 数 for($j=1;$j<=$i;$j++){ echo  "*& ...

  4. c++20701除法(刘汝佳1、2册第七章,暴搜解决)

    20701除法 难度级别: B: 编程语言:不限:运行时间限制:1000ms: 运行空间限制:51200KB: 代码长度限制:2000000B 试题描述     输入正整数n,按从小到大的顺序输出所有 ...

  5. IOS第12天(3,UIViewController的生命周期)

    #import "HMViewController.h" @interface HMViewController () @property(nonatomic,strong)NSA ...

  6. IOS第11天(3:UIPickerView省市联动)

    ********* #import "ViewController.h" #import "Province.h" @interface ViewControl ...

  7. mvn打包idea项目

    首先 通过cmd进入docs 然后用cd命令进入项目文件夹所在路径 然后输入mvn -Dmaven.test.skip=true package//-Dmaven.test.skip=true跳过测试

  8. windows7系统下一些常用工具的总结

    1.查看计算机的基本信息:计算机--右键--属性(快捷键:Win+Pause) 2.查看计算机的详细信息:开始菜单--所有程序--附件--系统工具--系统信息(运行命令:msinfo32) 3.定制计 ...

  9. websocket和swoole

    <head></head><body><script type="text/javascript">var sock = null; ...

  10. Wordpress制作文章页面single.php

    可以调用的文章内容: 调用文章标题:<?php the_title(); ?> 调用文章内容:<?php the_content(); ?> 调用文章摘要:<?php t ...