盒子
目录
文章目录
  1. 2014年CSS报告——考察如何使用CSS

《2014年CSS报告——考察如何使用CSS》

文章取自我的 Github repos: DailyReading, 作者:@paddingme
原文链接:https://github.com/paddingme/DailyReading/issues/1

2014年CSS报告——考察如何使用CSS

  1. 不要使用 * 和 _ 来 hack 而应该使用 IE 条件样式:

    我看见许多年长的前辈们还是在使用 *和_这样的浏览器Hack来解决IE某些版本的兼容问题。早在2008年Paul Lrish就提出替代方案,即使用IE条件样式来替代这些Hack。而在当你赶时间的时候,很容易忽略这些方法,以至于*和_这样的Hack持续在使用。
    条件注释只能用于IE5以上。如果安装了多个 IE,条件注释将会以最高版本的IE为标准。条件注释的基本结构和 HTM L的注释(<!– –>)是一样的。因此 IE 以外的浏览器将会把它们看作是普通的,注释而完全忽略它们。

    IE 将会根据 if 条件来判断是否如解析普通的页面内容一样解析条件注释里的内容。

    • gt : greater than,选择条件版本以上版本,不包含条件版本
    • lt : less than,选择条件版本以下版本,不包含条件版本
    • gte : greater than or equal,选择条件版本以上版本,包含条件版本
    • lte : less than or equal,选择条件版本以下版本,包含条件版本
    • ! : 选择条件版本以外所有版本,无论高低
    1
    2
    3
    4
    5
    6
    <!--[if IE 5]>仅IE5.5可见<![endif]-->
    <!--[if gt IE 5.5]>仅IE 5.5以上可见<![endif]-->
    <!--[if lt IE 5.5]>仅IE 5.5以下可见<![endif]-->
    <!--[if gte IE 5.5]>IE 5.5及以上可见<![endif]-->
    <!--[if ite IE 5.5]>IE 5.5及以下可见<![endif]-->
    <!--[if !IE 5.5]>非IE 5.5的IE可见<![endif]-->

    以上这些条件注释里的内容,在非IE浏览器只是作为一般的注释语句,不会显示出来的,
    如果想要条件注释里的内容,在非IE浏览器中也能显示出来,而且在IE浏览器中根据条件注释的判断条件来显示出来,看下面的代码:
    下面的代码是在非IE浏览器下运行的条件注释

    1
    2
    <!--[if !IE]><!-->您使用不是 Internet Explorer<!--<![endif]-->
    <!--[if IE 6]><!-->您正在使用Internet Explorer version 6或者 一个非IE 浏览器<!--<![endif]-->

    摘自IE中的条件判断注释,判断浏览器版本类型

  2. z-index 最低的值应该小于999999更为合理。

  3. 颜色最常用的是 bootstrap 的 papayawhip 还有些常用的颜色名:
    antiquewhite, azure, olive, bisque, aliceblue, lightsteelblue, blueviolet, firebrick, lightskyblue, lightseagreen, darkorange, seashell, ghostwhite, papayawhip, cornsilk, navajowhite。作者最喜欢的是 papayawhip,让人赏心悦目。

参考: