CSS教程,DIV CSS视频教程,DIV CSS模板,DIV CSS布局入门教程 - CSS中国

以下是Blueprintcss官方网的例子，作者用相当清晰的代码展示了Blueprintcss精妙和强大的功能。

例子文件:Sample.html              http://www.blueprintcss.org/tests/parts/sample.html

<link rel="stylesheet" href="../../blueprint/screen.css" type="text/css" media="screen, projection">

这个文件将所有的CSS文件合并到一起，减少了并发连接数。

一共包含了以下几个CSS

/* reset.css */

/* typography.css */

/* forms.css */

/* grid.css */

此外，如果是IE8以下版本则包含/* ie.css */

  作者的注释已经很清晰了，代码也很清晰。跟着我一起理解一遍即可。

reset.css 代码：

/* --------------------------------------------------------------      
       
   reset.css     
   * Resets default browser CSS.     
        
-------------------------------------------------------------- */     
/*原文作者注释已经很清晰了*/     
     
     
html, body, div, span, object, iframe,      
h1, h2, h3, h4, h5, h6, p, blockquote, pre,      
a, abbr, acronym, address, code,      
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,      
fieldset, form, label, legend,      
table, caption, tbody, tfoot, thead, tr, th, td {      
  margin: 0;      
  padding: 0;      
  border: 0;      
  font-weight: inherit;      
  font-style: inherit;      
  font-size: 100%;      
  font-family: inherit;      
  vertical-align: baselinebaseline;      
}      
/*行高1.5，也就是150%,刚看了淘宝UED的碳酸饮料会杂志，上面有介绍*/     
body {       
  line-height: 1.5;       
}      
     
/* Tables still need 'cellspacing="0"' in the markup. */