12bet,的读书笔记

最佳实践

若是不确信的话,就去验证

12bet,在调试之前可以简单地验证一下代码,12博体育,格式不正确的XHTML或CSS将会导致很多布局问题。W3C提供了XHTML和CSS的验证工具,链接XHTMLCSS

创建并测试CSS时优先在最高级、最先进的浏览器中进行,然后考虑其他浏览器

12bet,首先基于先进浏览器编写,然后再为那些非标准浏览器调整的话,代码将从一个开始就非常标准,12博体育,调整的过程也将会非常容易。

若用浮动实现布局,请确保正确地清除了浮动

为元素应用内边距或边框来避免外边距重叠

12bet,现在可以通过触发BFC来防止外边距重叠

避免同时为元素制定明确的内边距/边框值与宽度/高度值

12bet,兼容性问题

避免IE6的“无样式瞬间现象”

若在IE6中用@import<http://www.liuwanlin.info/code>引入外部样式就会出现闪烁的情况,可以通过link元素,或是在页面中添加script元素来避免这个问题

不要依靠min-width或min-height属性

兼容性问题

尝试减少百分比值

适当减少百分比,让其相加稍小于100%

确保要实现的效果确实存在

不同的效果在不同的浏览器中兼容性不一样,需要进行更多的测试

牢记“LoVe/HAte”(爱恨)连接规则

在为连接元素指定伪类时,注意以下顺序:linkvisitedhoveractive,任何其他的声明顺序都可能会导致问题。若还要考虑:focus伪类,则规则修改为LVHFA

牢记“TRouBLED”(麻烦的)边框简写顺序

bodermarginpadding的顺序都是按照时钟的顺序,toprightbottomleft

为非零值表明单位

除了line-height以外,我们需要为非零的值标上单位

测试不同的字体大小

高级浏览器会允许用户调整字体大小,所以需要调整字体大小来进行更多的测试

HTML和CSS中统一大小写

测试时使用嵌入样式,发布时再改为外部输入

在测试时将样式嵌入到HTML代码中,可避免许多因浏览器缓存导致的不正常现象。对于较老的浏览器,这一点很重要。但是在发布前,记得将他们改为@import<http://www.liuwanlin.info/code>或<link><http://www.liuwanlin.info/code>引入

用明显的边框辅助调试布局

通过类似div {border: 1px solid #f00}之类的全局规则可以帮助检查很多细微的布局差错

指定图片路径是不要使用单引号

设置背景图片时不需要使用引号。如果使用单引号,苹果机上的IE无法正确加载图像,所以要么使用双引号,要么不用引号

若使用了锚点(anchor),那么在为超链接应用样式要格外小心

不要未雨绸缪的链接至作为“占位符”的空样式表

这样会加长页面的加载时间