css3新增属性 

<html><head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        div{
            font-size: 30px;
            width: 150px;
            background-color: red;
            margin: 20px;
            /*设置不透明度*/
            /*opacity: 0.2;*/
            /*box-shadow: 4px 14px 20px black;*/
        }
        /*设置透明度:红色 绿色 蓝色 透明度*/
        .test1{
           background-color: rgba(255,0,0,1.0);
        }
        .test2{
           background-color: rgba(255,0,0,0.8);
        }
        .test3{
           background-color: rgba(255,0,0,0.6);
        }
        .test4{
           background-color: rgba(255,0,0,0.4);
        }
        .test5{
           background-color: rgba(255,0,0,0.2);
        }

        p{
            font-size: 50px;
            color: red;
            /*设置文字阴影, 水平方向  垂直方向 模糊 颜色*/
            text-shadow: 5px 5px 10px green;
        }

        .test6{
            background-color: red;
            width: 400px;
            height: 250px;
            border: 20px solid green;
            /*设置圆角*/
            /*border-radius: 40px;*/
            border-top-left-radius: 90px;
            border-bottom-left-radius:100px;
        }
    </style>
</head>
<body>
   <div class="test1">111</div>
   <div class="test2">222</div>
   <div class="test3">333</div>
   <div class="test4">444</div>
   <div class="test5">555</div>

   <p>小码哥</p>

   <div class="test6">
       dewhdewjhdhjew
   </div>

</body></html>

 

posted @ 2015-06-17 14:02  Emyin  阅读(152)  评论(0)    收藏  举报