使用缩写可以帮助减少你CSS文件的大小，更加容易阅读。css缩写的主要规则如下：

颜色

16进制的色彩值，如果每两位的值相同，可以缩写一半，例如：
#000000可以缩写为#000;#336699可以缩写为#369;

盒尺寸

通常有下面四种书写方法:

• property:value1; 表示所有边都是一个值value1；
• property:value1 value2; 表示top和bottom的值是value1,right和left的值是value2
• property:value1 value2 value3; 表示top的值是value1，right和left的值是value2，bottom的值是value3
• property:value1 value2 value3 value4; 四个值依次表示top,right,bottom,left

方便的记忆方法是顺时针，上右下左。具体应用在margin和padding的例子如下：
margin:1em 0 2em 0.5em;

边框(border)

边框的属性如下：

• border-width:1px;
• border-style:solid;
• border-color:#000;

可以缩写为一句：border:1px solid #000;

语法是border:width style color;

背景(Backgrounds)

背景的属性如下：

• background-color:#f00;
• background-image:url(background.gif);
• background-repeat:no-repeat;
• background-attachment:fixed;
• background-position:0 0;

可以缩写为一句：background:#f00 url(background.gif) no-repeat fixed 0 0;

语法是background:color image repeat attachment position;

你可以省略其中一个或多个属性值，如果省略，该属性值将用浏览器默认值，默认值为：

• color: transparent
• image: none
• repeat: repeat
• attachment: scroll
• position: 0% 0%

字体(fonts)

字体的属性如下：

• font-style:italic;
• font-variant:small-caps;
• font-weight:bold;
• font-size:1em;
• line-height:140%;
• font-family:”Lucida Grande”,sans-serif;

可以缩写为一句：font:italic small-caps bold 1em/140% “Lucida Grande”,sans-serif;

注意，如果你缩写字体定义，至少要定义font-size和font-family两个值。

列表(lists)

取消默认的圆点和序号可以这样写list-style:none;,

list的属性如下:

• list-style-type:square;
• list-style-position:inside;
• list-style-image:url(image.gif);

可以缩写为一句：list-style:square inside url(image.gif);

相关日志

• FLEX例子之图片控件(Image) (0)
• 国外免费的CSS样式和模板下载 (13)
• FLEX例子之数据表(DataGrid) (0)
• 在flex中应用css样式详解 (0)
• FLEX例子之Accordion(折叠式面板) (0)
• FLEX例子之链接切换条(LinkBar) (0)
• FLEX例子之VideoDisplay(FLV视频播放器) (1)
• FLEX例子之滑动块(Slider) (0)
• FLEX例子之应用程序控制条(ApplicationControlBar) (1)
• FLEX例子 – SWFloader(SWF加载器) (0)

转自http://www.buguat.com/post/107.html

在网上有很多现成的以 (X)HTML/CSS为基础的模板。如果你是一个网站的设计开发人员，其实没有必要一遍又一遍的浪费时间写着同样的代码。而 Web-dev-community 这个团体在过去几年里在CSS方面做了很多研究，总结了许多实用性和可视性都非常不错的CSS代码。

下面这些列表提供了免费并且高效的CSS模板，几乎所有的都包含图片和全图层结构。

Open Source Templates 是一个开源的免费CSS和XHTML模板展示站，他们把最棒的设计放在了首页上。

OSWD 是一个提供免费模板下载分享的模板，提供了2080个设计。

OSWT 是一个为那些没有设计基础的用户们提供了一个可以简单快速上手的网站，同样也为有卓越设计才能的设计师们提供了展示作品的舞台。

Maxdesign 提供了很多免费的两栏和三栏的CSS样式页。

CSSplay 提供了许多专业又免费的样式下载。许多模板的使用可以不经许可直接使用，当然也有部分需要事先发个EMAIL征求一下。

Mollio是一个简单的html /CSS 模板集合。他的目的在于能提供许多模板页面，使得我们制作成具有些简单基本的内容也包含CSS应用的页面

Six Shooter Media 提供了15个模板，这些都是用于创建网站或者形成WordPress主题的框剪。

CSS Design Templates提供了许多你可以免费下载并且任意修改的模板，只有一个前提：你要在页面中提供一个能返回下载站的链接。

CSS Intensivstation 包含了15个XHTML 1.0 and CSS2样式。

在CSSFILL 你可以找到一系列完全免费的由Michael Strand设计的CSS / XHTML样式或者模板。

CSS Frames Layouts用尽量少的表格和CSS模板页面帮你快速创建网站框架

CSS Template Gallery虽然提供了搜索功能，但只有32款模板。

Ex-Designz 提供了超过300个的(X)HTML-based CSS模板.

Jimmy Lin 提供了100%高校可用的 CSS/XHTML代码，而且兼容 IE5.0+, FireFox 1.5, Opera 8.5和 Safari 2等多种浏览器。他们不使用hacks（就是为了兼容不同浏览器所做的一系列补救措施，只是过渡产物），而且还可以很容易的修改。模板没有版权的限制，但 你最好还是包含一个返回下载页的链接。 and

Layout Gala 提供了 40个专业的样式. 兼容度高，而且都成功通过了Internet Explorer/win 5.0, 5.5, 6 a和 of IE 7beta 2 preview ; Opera 8.5, Firefox 1.5 ，Safari 2兼容测试。

Little Boxes 包含16个经典的样式

Solucija 是一个免费无限制的XHTML / CSS模板站。非商业网站和商业网站都可使用。虽然在底部写一个版权连接，并不是必要的，但这显示了你对他们的感激和支持。

The Layout Reservoir 提供了两栏（左+右）和三栏样式。虽然不需要事先向 BlueRobot.com申请，但是底部的一个模板来源链接，会帮助其他有需要的设计师找到这个资源。

Inknoise 提供了一个样式设计工具，你可以选定样式类型，宽度，还有其它选项，然后再下载这个属于你的独一无二的模板

Code Sucks 提供了100多个基于1024*764分辨率的 CSS样式下载.

SSI Developer提 供了使用 XHTML1.0 和 CSS2的模板下载。需要注意的是：这些模板都只是学习工具，在真正应用到成品网站之前需要经过彻底的测试。模板基于高效的CSS2和 XHTML1.0编译，而且已经通过了WinXP with IE6, Opera 7.11 ，Mozilla 1.5b ，Firefox 0.8，Netscape 7.1等多个浏览器的测试。

本文翻译自techmagazine网站,原文链接:http://techmagazine.ws/free-css-layouts-and-templates/

以下是本站所加信息：

免费大量css模板 http://www.freecsstemplates.org/

三栏复合布局演示  http://www.onestab.net/a/pie/3colcomplexside.html

自由伸展的三栏复合布局  http://www.onestab.net/a/pie/thr.col.stretch.html

第一个，Open Source Web Design(OSWD)开源设计
http://www.oswd.org/

第二个，solucija（精品）
http://www.solucija.com/home/css-templates/

第三个
http://www.tristarwebdesign.co.uk/templates.html

第四个 sixshootermedia
http://www.sixshootermedia.com/free-templates/

第五个 openwebdesign
和第一个Open Source Web Design(OSWD)是不同的哦，也是精品，不过有些是要钱的
http://www.openwebdesign.org/ 标签：ASP, CODE, CSS, DIV, FIREFOX, html, php, ria, s2, Text, w3c, wordpress, 资源

相关日志

• 网页通过w3c验证 (2)
• wordpress主题实现不同分类使用不同样式模板 (8)
• KingCMS第一篇 (0)
• 再推荐一本css的书 (5)
• wordpress真的是太漂亮了 (0)
• FLEX 学习资料汇总 (0)
• 临沂汽车界–修改版 (0)
• css 3.0 中文手册API (3)
• 又折腾了 (3)
• 选定两套程序 (0)

一会再进行下面的网页加载速度上的优化。

相关日志

• CSS禅意花园中文版PDF电子书下载 (17)
• 再推荐一本css的书 (5)
• 国外免费的CSS样式和模板下载 (13)
• Zen Coding: 快速的编写你的CSS/HTML (0)
• 常用CSS缩写语法总结 (0)
• FIREFOX-插件推荐 (0)
• FLEX中嵌入html代码 (1)
• SiteMap (1)
• FLEX 学习资料汇总 (0)
• Dreamweaver CS4中使用CSS3属性提示 (1)