项目问题1："border:none"与"border:0px"有什么区别呢？

1、其实，从大体上讲，border:none;与border:0的区别体现有两点：
（1）理论上的性能差异
（2）浏览器兼容性的差异
性能差异——
a、“border:0px”中，把border设为“0”，虽然页面上看不见，但是如果按照border默认值来理解，浏览器依然对border-width/border-color进行了渲染，即已占用了内存值。
b、“border:none”中，当浏览器解析“border:none”时，将不会对border属性值进行渲染，相对应的即也不会消耗内存值。


兼容性差异——
特别的，是针对于IE6/IE7与标签button、input而言
a、“border:0px”中，似乎比“border:none”更有效，所有浏览器都一致把边框隐藏。
b、“border:none”中，似乎对IE6/IE7无效边框依然存在


综合而言，“border:none”与“border:0px”之间的区别在于“有渲染和没渲染”，类似于“display:none”与“visibility:hidden”类似。


解析——如何让“border：none”实现全兼容？不受IE6/IE7的控制
只需要给元素加上“background”属性即可。


2、从大体上看，两者除了在渲染性能上面的差别外，在标准浏览器上页面的表现是没有任何差别的；
   从本质上来讲，
（1）“border:none”——“border-style”的简写
A.在Chrome审查元素中，会显示如下：

element.style {
	border: none;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	border-width: initial;
	border-color: initial;
}

B.在Firefox，用firebug审查元素中，会显示如下：

element.style {
    border: medium none;
}

注意：在这里的border显示的是“medium”值。

（2）“border:0”——“border-width”的简写
A.在Chrome审查元素中，会显示如下：

element.style {
	border: 0;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-style: initial;
	border-color: initial;
}

B.在Firefox，用firebug审查元素中，会显示如下：

element.style {
    border: 0 none;
}

3、在非标准浏览器和标准浏览器情况比较
（1）在firebug中两者的区别——
在IE6/IE7浏览器下：“border:0”被解析为“border-width:0”；
“border:none”被解析为“border-style”。


（2）在标准浏览器中两者区别——
在标准浏览器中，“border:0”比“border:none”多渲染了一个“border-width:0”，这也正是为什么“border:none”的性能要比“border:0”高？
  A.“border:none”被理解为关闭此标签；
  B.“border:0”虽说不显示，但同样占内存。