当前位置: 代码迷 >> HTML/CSS >> CSS shorthand properties(CSS 缩写本质)
  详细解决方案

CSS shorthand properties(CSS 缩写本质)

热度:1030   发布时间:2013-02-28 11:33:09.0
CSS shorthand properties(CSS 缩写性质)

第一次自己试着翻译。

①font

font-size: 1em;

line-height: 1.5em;

font-weight: bold;

font-style: italic;

font-family: serif;

可替换成 font: italic bold 1em/1.5em serif;

其设置顺序是font-style,font-variant,font-weight,font-size/line-height,font-family。

其中font-size和font-family是必须设置的,其他未设置的属性会自动设置成默认值(normal)。

②background

background-color: #fff;

background-image: url(#);

background-repeat: no-repeat;

bakcground-position: top left;

可替换成background: #fffurl(#) no-repeat top left;

其设置顺序是background-color,background-position, background-size, background-repeat, background-origin,background-clip, background-attachment, and background-image.

如果缺少其中的某个属性是允许的,如 background:#ff0000url(#);其中未设置的会使用默认值。如省略background-position会使用top-left,background-repeat会由horizontally和vertically代替。

③list-style

list-style: #fff;

list-style-type: disc;

list-style-position: outside;

list-style-image: url(#);

可由list-style: discoutside url(#);

设置顺序可以是list-style-type, list-style-position,list-style-image

如果缺少某项值,浏览器会按其默认值,他们分别是disc,outside,none

④Margin & padding

margin: 2px 1px 3px 4px;(top,right,bottom,left)

margin: 5em 1em 3em;(top,right and left,bottom)

margin: 5em 1em;(top and bottom,right and left)

⑤border

border: 1px black solid;(border-width,border-color,border-style)

  相关解决方案