你能想到什么是好的CSS缩短?

时间:2009-05-13 04:01:18

标签: css forms stylesheet short shorthand

我能想到的是

font:bold 20px Verdana,sans-serif / *一行变种,大小和家庭* /

颜色:#336 / *短色码* /

高度:0 / * 0 * /

时无需指定单位

border:0 / *与border相同的效果:none但更短* /

背景:#ffc / *如果需要的话是彩色* /

,则无需使用背景色

填充:0;边界:0;保证金:0 / *仅显示内容,但不显示任何其他内容* /

border:1px虚线#ff0 / *厚度,样式和颜色* /

保证金:0 0.5em / *指定上,下,左,右边距* /

3 个答案:

答案 0 :(得分:3)

 1. background: #fff url(image.png) no-repeat 20px 100px fixed;
 2. ul { list-style: decimal-leading-zero inside; }

以逗号分隔的声明

  1. h1,h2,h3,h4,h5,h6 {font-family:Helvetica,Verdana,sans-serif; }
  2. 第一胎选择器

     1. .footer em:first-child { color:#ccc; }
    

    CSS3功能

    圆角框

    1. .rounded_corner { -moz-border-radius:10px; -webkit-border-radius:10px; width:400px; height:100px; background-color:#000; }
    2. 暗影效果

      .shadow {width:400px;高度:200像素;背景色:#000; -webkit-box-shadow:5px 5px 2px #ccc; }

答案 1 :(得分:0)

您还可以使用font属性

指定行高
font: bold 20px/1em Verdana, sans-serif /* one line for variant, size, and family */

其中1em是行高

答案 2 :(得分:0)

大纲的另一个:

outline:3px dotted gray;

list-style也支持图像:

list-style:square inside url(image.gif);

有点多余,但这是另一篇解释它们的文章:

http://www.456bereastreet.com/archive/200502/efficient_css_with_shorthand_properties/