關於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();}

    }

這樣寫是不會所有執行的，前面的位移會執行，可是後面的放大就不會執行。