关于CSS和CSS3中一些注意事项1

标签：

关于怎么用boder属性设置出三角形状：

    width: 0px;

    height: 0px;

    border-top: 50px solid  red;

    border-right:50px solid blue ;

    border-left:50px solid green ;

    border-bottom:50px solid blueviolet ;



当将四条边设置成如上代码时，会出现一个由上下左右四个小三角形组成的正方形，如果我们要取其中的一个，只需要将另外三边的颜色设置为透明色（transparent）就行。如下图所示：



-------------------------------------------------------------------------

关于内外边距（padding，margin）：

padding，margin可以有1到4个值，当设置的值个数不同时，各个值所对应的意思也不同；


- 当padding或者margin只有一个值时，代表一个元素所有边距的宽度

- 当padding或者margin有二个值时，第一个值代表上下边距，第二个值代表左右边距

- 当padding或者margin有三个值时，第一个值代表上边距，第二个值代表左右边距，第三个值代    表下边距

- 当padding或者margin有四个值时，分别代表上右下左边距


关于css3动画：

@keyframes 规则用于创建动画，比如

    @keyframes myfirst{

       from {background: red;}
  　 to {background: yellow;}
    }

这里需要注意的是，创建动画的时候，from和to 里面不能设置相同属性的值，例如2D转换（transform)中包含了translate(), rotate() ,scale(), skew(), matrix() 5种方法，在创建动画的时候，不能这样写：

    @keyframes myfirst  {

    　　from {transform: translate();transform: scale();}
    　　to {transform: translate();transform: scale();}

    }

这样写是不会全部执行的，前面的位移会执行，但是后面的放大就不会执行。

关于CSS和CSS3中一些注意事项1

标签：

原文地址：http://www.cnblogs.com/ddzhao1989/p/4659529.html