码迷,mamicode.com
首页 > Web开发 > 详细

css3简写

时间:2015-10-19 12:40:28      阅读:170      评论:0      收藏:0      [点我收藏+]

标签:

1、font的简写:font:italic small-caps bold 12px/1.5em arial,verdana 
       等效于: font-style:italic;font-variant:small-caps;font-weight:bold;font-size:12px;line-height:1.5em;font-family:arial,verdana; 
         顺序:  font-style| font-variant| font-weight | font-size| line-height| font-family
        注意:简写的时候,font-size 与 line-height 必须要通过斜杠/来组成一个词,不容分割
2、 background的简写:background:#fff url(‘images/bg.png‘) no-repeat fixed left top;
            等效于:background-color:#fff;background-image:url(‘images/bg.png‘);background-attachment:fixed;background-position:left top;
              顺序:background-color| background-image| background-repeat| background-attachment| background-position
3、margin 和 padding(它们的用法相同,我以margin来说明)
         margin的简写:margin:1px 2em -23px;
               等效于:margin-top:1px;margin-right:0px;margin-bottom:2em;margin-left:-23px;
                 顺序:margin-top| margin-right| margin-bottom| margin-left
4、 border(这是四个边框的样式)的简写:border:1px solid #000;
                           等效于:border-width:1px;border-style:solid;border-color:#000;
                             顺序:border-width| border-style| border-color
border又分为:border-top| border-right| border-bottom| border-left(上、右、下、左)
       border-top:1px solid #000; 等效于:border-top-width:1px;border-top-style:1px;border-top-color:#000;
   
 5、list-style 的简写:list-style:square outside url("images/bullet.gif");
               等效于:lsit-style-type:square;list-style-position:outside;list-style-image:url(‘imags/bullet.gif‘);
                 顺序:list-style-type| list-style-posiiton| list-style-image

css3简写

标签:

原文地址:http://www.cnblogs.com/yu0312chao/p/4891298.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!