css样式简写

css样式简写

background简写

简写公式:

background: [background-color] [background-image] background-repeat [background-position] / background-size [background-clip];

在css2.1的background的简写公式中只有color、image、repeat、attachment、position五个属性,在css3中加入了size、origin和clip,其中的’/’表示在支持’/’写法的浏览器中可以接着继续写background-size属性

example


.example {
    background: red url('../back.png') no-repeat scroll center center / 50% content-box content-box;
}

font简写

简写公式

font:[font-style] [font-weight] [font-size] / [line-height] [font-family]

“/”的作用类似于background

example

.myFont {
    font: normal bold 20px / 24px "Microsoft YaHei";
}

border简写

简写公式

border:[border-width] [border-style] [border-color]

example

.box {
    border: 1px solid #000000;
}
    原文作者:咖喱61
    原文地址: https://segmentfault.com/a/1190000017816303
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞