html5（三）

body{ text-align:center;}
#mainbox
{
     display:block; 
     width:500px; 
     margin:50px auto;
      padding:15px; 
      text-align:center;
      border:1px solid #999999; 
      background:#dddddd;
      /*圆角
      -webkit-border-radius:20px 10px 30px 50px;
      boder-radius:20px 10px 30px 50px;
       -webkit-border-radius:20px ;
      boder-radius:20px;
            -webkit-border-radius:20px / 10px;
      boder-radius:20px / 10px;*/
      /*阴影效果
      -webket-box-shadow:rgb(150,150,150) 5px 5px;
      box-shadow:rgb(150,150,150) 5px 5px;*/
     
      /*线性渐变
      background: -webkit-linear-gradient(top,#ffffff,#006699);*/
       /*放射渐变
      background: -webkit-radial-gradient(top,#ffffff,#006699);*/
      /*轮廓
      outline: 2px dashed #000099;
      outline-offset:15px;*/
      /*边框图片
      -webkit-border-image:url("diamonds.png") 29 stretch;
      border-image:url("diamonds.png") 29 stretch;*/
      /*缩放
      -webkit-transform:scale(2,-2);*/
      /*旋转
      -webkit-transform:rotate(0deg);*/
      /*倾斜
      -webkit-transform:skew(20deg);*/
       /*移动
      -webkit-transform:translate(100px);*/
      -webkit-transform:-webkit-transform 1s ease-in-out 0.5s;
          }
          #mainbox:hover
          {
              -webket-transform:rotate(5deg);
              
              }

#title
{
    font:bold 36px MyNewFont,verdana,sans-serif;
      /*文字阴影
    text-shadow:rgb(0,0,150) 3px 3px 5px;*/
    
     /*文字透明度*/
    text-shadow:rgba(0,0,0,0.5) 3px 3px 5px;
    color: hsla(120,100%,50%,0.5);
    }
    @font-face{ font-family:'MyNewFont'
                src:('font.ttf');
                }