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:none 和border:0区别差异的更多相关文章

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

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

  2. border:none与border:0的区别

    border:none与border:0的区别体现为两点:一是理论上的性能差异,二是浏览器兼容性的差异. 性能差异: [border:0;]把border设为“0”像素效果等于border-width ...

  3. unittest和unittest2的区别差异、unittest2框架------执行原理

    unittest和unittest2的区别差异 参考:https://pypi.org/project/unittest2/ unittest2是Python 2.7及更高版本中添加到unittest ...

  4. HTTP协议以及HTTP2.0/1.1/1.0区别

    HTTP协议以及HTTP2.0/1.1/1.0区别 一.简介 摘自百度百科: 超文本传输协议(HTTP,HyperText Transfer Protocol)是互联网上应用最为广泛的一种网络协议.所 ...

  5. 本机ip、127.0.0.1和0.0.0.0区别及内环流量

    本机ip.127.0.0.1和0.0.0.0区别及内环流量 所谓内环流量 简单的说是指 计算机内部,程序间通讯产生的流量,或者叫 本地流量,对应的是来自网络的流量. 比如,你安装了卡巴斯基,avast ...

  6. http1.0 1.1 2.0区别

    http1.0 1.1 2.0区别 转载:https://blog.csdn.net/linsongbin1/article/details/54980801/ 1.HTTP1.0 1.1区别 (1) ...

  7. 问题定位 | Peronca Xtrabackup 8.0近日踩坑总结 - xtrabackup 2.4和8.0区别

    目录 前言 适配过程中遇到的坑 xtrabackup 2.4和8.0区别 问题定位 坑一:MySQL 8.0 + Semi-Sync 重建问题 坑二:MySQL 8.0 + Group-Replica ...

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

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

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

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

随机推荐

  1. react动画难写?试试react版transformjs

    简介 transformjs在非react领域用得风生水起,那么react技术栈的同学能用上吗?答案是可以的.junexie童鞋已经造了个react版本. 动画实现方式 传统 web 动画的两种方式: ...

  2. [deviceone开发]-openPage的动画效果示例

    一.简介do_App的openPage支持16种过场动画,这个示例直观的展示16种动画的效果.适合初学者.二.效果图三.相关下载https://github.com/do-project/code4d ...

  3. iOS - 捕获应用程序崩溃日志

    作为一名iOS移动应用开发者,为了确保你的应用程序正确无误,在将应用程序提交到应用商店之前,你必定会进行大量的测试工作:而且在你测试的过程中应用程序运行的很好,但是在应用商店上线之后,还是有用户抱怨应 ...

  4. jsonp跨域请求

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. 企业号微信支付 公众号支付 H5调起支付API示例代码 JSSDK C# .NET

    先看效果 1.本文演示的是微信[企业号]的H5页面微信支付 2.本项目基于开源微信框架WeiXinMPSDK开发:https://github.com/JeffreySu/WeiXinMPSDK 感谢 ...

  6. 步步深入:MySQL架构总览->查询执行流程->SQL解析顺序

    前言: 一直是想知道一条SQL语句是怎么被执行的,它执行的顺序是怎样的,然后查看总结各方资料,就有了下面这一篇博文了. 本文将从MySQL总体架构--->查询执行流程--->语句执行顺序来 ...

  7. python安装numpy、scipy和matplotlib等whl包的方法

    最近装了python和PyCharm开发环境,但是在安装numpy和matplotlib等包时出现了问题,现总结一下在windows平台下的安装方法. 由于现在找不到了工具包新版本的exe文件,所以采 ...

  8. 浅谈 C++ 中的 new/delete 和 new[]/delete[]

    在 C++ 中,你也许经常使用 new 和 delete 来动态申请和释放内存,但你可曾想过以下问题呢? new 和 delete 是函数吗? new [] 和 delete [] 又是什么?什么时候 ...

  9. 怎么在GitHub上寻找开源项目呢

    find projects GitHub Explore: Popular and trending projects. GitHub Stars: Projects starred by other ...

  10. angularJS(3)

      angularJS(3) 一.angularJs的指令模型ng-model指令 ng-model 指令 绑定 HTML 元素 到应用程序数据. 为应用程序数据提供类型验证(number.email ...