文章·资料 电脑软件 手机软件 网站源码




    本 站 搜 索
   推 荐 文 章        More...
华硕易电脑(ASUS Eee PC 10..
先来段开场白:为了外出携带方便..
Acronis True Image 使用..
  一款可以在Windows下使用..
Norton Ghost 使用详解
一、分区备份   使用Ghost..
    文 章 阅 读 排 行
“啊估文章软件站”网站系..
一、调试测试网站系统时,如何..
关于 Firefox 在中国持续..
亲爱的 Firefox 用户及 Firefox..
向日葵远程控制软件,设置..
向日葵远程控制软件有个人版和..
夸克网盘新用户注册如何获..
夸克网盘,新用户注册如何获得1..
FileZilla Server 设置参考
FileZilla Server 启动界面 ..
PakePlus 构建 APP 需要 Gi..
PakePlus 是一个基于 Rust Taur..
电脑显示器使用 HDMI 数据..
如果电脑显示器使用 HDMI 数据..
ASP/JavaScript:不刷新页..
function GuReturnElement(..
分享几个免费申请 SSL 证..
DigiCert 原 Symantec(赛门铁..
关闭微信的个性化推荐广告
有网友说到,微信的初衷是拉近..
 文 章 信 息
CSS常用语法缩写
评论()〗〖留言〗〖收藏
〖文章分类:电脑·手机·网络 / 网站设计·开发·优化〗〖阅读选项
使用缩写可以帮助减少你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);

文章作者:未知  更新日期:2013-04-26
〖文章浏览:〗〖发送文章〗〖打印文章
〖文章阅读说明〗
·本站大部分文章转载于网络,如有侵权请留言告知,本站即做删除处理。
·本站法律法规类文章转载自[中国政府网(www.org.cn)],相关法律法规如有修订,请浏览[中国政府网]网站。
·本站转载的文章,不为其有效性,实效性,安全性,可用性等做保证。
·如果有什么问题,或者意见建议,请联系[网站管理员]。