绿色资源网:您身边最放心的安全下载站! 最新软件|热门排行|软件分类|软件专题|论坛转帖|厂商大全

绿色资源网

技术教程
您的位置:首页网页设计HTML/CSS → 常用CSS缩写语法总结

常用CSS缩写语法总结

我要评论 2010/01/10 18:19:33 来源:绿色资源网 编辑:绿色资源站 [ ] 评论:0 点击:291次

我们在设计CSS时可以使用css缩写,这样可以减少你CSS文件的大小,而且更加容易阅读和查找。

css缩写的主要规则如下:

margin/padding

通常写法,会遇到以下三种情况

margin-top:1px;
margin-right:10px;
margin-bottom:5px;
margin-left:20px;

margin-top:5px;
margin-right:5px;
margin-bottom:5px;
margin-left:5px;

margin-top:0px;
margin-right:10px;
margin-bottom:0px;
margin-left:5px;

那么我们进行CSS缩写后会让你目惊口呆的效果.如下

margin:1px 10px 5px 20px;

margin:5px;

margin:0 10px 0 5px;

书写顺序是 margin:上 右 下 左 ,

在CSS中.值为0的时候可以将单位省略不写就像第三种写法一样.

其中padding和margin基本是一样的写法

怎么样.是不是大吃一惊.是的.CSS缩写就是这样做到的.

border

通常写法:

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

缩写后:

border:1px solid #000;

书写顺序:border:宽度 边框线种类 颜色;

Background

通常写法:

background-image:url(bg.png);
background-color:#00f;
background-repeat:no-repeat;
background-position:0 0;

缩写后:

background:url(bg.png) #00f no-repeat 0 0;

书写顺序:background:背景图片 颜色 重复类型  定位;
         background:image   color  repeat   position;

Font

通常写法:

font-family:"宋体";
font-size:2em;
line-height:180%;
font-weight:800;


缩写后:

font:800 2em/180% "宋体";

书写顺序:font:加粗 字体大小/行高 字体;

在使用Font缩写时至少要有 字体大小和字体这两项

font:字体大小 字体;

Color

通常写法:

color:#000000;
color:#001188;

缩写后:

color:#000;
color:#018;

16进制的色彩值时,如果每两位的值相同,可以缩写一个

关键词:常用CSS缩写语法

阅读本文后您有什么感想? 已有 人给出评价!

  • 0 欢迎喜欢
  • 0 白痴
  • 0 拜托
  • 0 哇
  • 0 加油
  • 0 鄙视