这里跟大家分享几点很小的css造成问题，都是不容易察觉的，希望大家在设计div+css模板的时候注意。
1.ie在img标签后面有空格的bug
其实这个应该是很常见的一个bug了，先让大家看看问题页面！
http://www.23live.cn/html/bug/IE_bug.html
大家可以打开这个页面的源代码，就会发现第一图像的img标签跟div的结束标签直接有空隙，然而第二个是没有的，这个就是ie的img标签bug，请大家写模板的时候注意这点，虽然是小小的几个像素，但是实在不咋好看。
2.ie6双倍边距及火狐float问题bug下面是问题展示页面
http://www.23live.cn/html/bug/float.html
在ie6下，div浮动的时候，会有一个双倍边距的bug，只要添加一个display:inline就可以解决，具体本人也了解不深。
火狐的那个也不算是bug，应该是按照标准解析了，不过不是很适合我们的思维。火狐下最外层的div没有完整的包含内部的div，解决办法上面的文件的源代码里面的注释中写到了。大家可以看看代码。
3.火狐背景图片消失bug
这个问题是我无意中发现的，很是奇怪，这个应该确信是火狐的bug了。
事情出现的原因是这样的，当你设置了背景图片的时候，ie显示正常，但是火狐却没有显示，如果网友很大，看到的效果是：背景图片在火狐中一闪而过，而不是没有显示。
解决方法也是无意中发现的，只要把css中背景图片的地址改为完整网址，如12.jpg，改为www.23live.cn/12.jpg就可以了。因为在火狐中是一闪而过，而使用完整网址的话，浏览器就会去重新解析，下载图片，这样产生了一定的延时，一闪而过的图片得以显示。
4.说说居中的问题。
这样有一种比较不错的居中方案，css实现网页整体居中。相信很多朋友的代码是使用的这个，其实这个代码是有点问题的，就是不能在使用相对定位去定位一个标签了，如果使用了相对定位后，就会在改变浏览器窗口大小的时候，出现错位的问题。
5.ie7一个奇怪的乱码的bug
此bug来自sincs的发现，
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>标题</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
这样的写法竟然在IE7下无法显示，查看源文件是正常输出了的，可在Firefox下是正常显示。
应该是title的里面的中文导致的，因为之前没有文件告诉浏览是什么编码。
解决方法也很简单，就是把下面带有编码的meta移动的前面就好了。
6.css文件中文注释bug
这个是ie6下的bug，单独的css文件注释，如果第一个注释里面有中文，那么这个样式将不会被引用。这个大家注意就好了，避免了就没有问题了。
（转载本文，请注明出处为：网络营销之家--www.okcome.com） |
会员群：