• 流 旋转 和一些特效


     1 <html xmlns="http://www.w3.org/1999/xhtml">
     2 <head>
     3 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     4 <title>无标题文档</title>
     5 <link rel="shortcut icon" href="bg_5bad577.jpg">
     6         <style type="text/css">
     7         *{ margin:0px auto; padding:0px}
     8         #di{ width:0px;
     9             height:0px;
    10             border-bottom:100px solid white;
    11             border-left:100px solid white;
    12             border-top:100px solid #00F;
    13             border-right:100px solid white;
    14                 }
    15         #e1{ margin:50px;
    16             
    17             }
    18         #w1{ width:200px;
    19             height:200px;
    20              border-bottom:10px solid #F00;
    21              border-left:10px solid #600;
    22             transform:rotate(45deg)
    23             } 
    24         #a1{ width:500px; height:50px; border:1px solid #e9e9e9; float:left}
    25         .a2{ width:100px; height:50px; float:left; text-align:center; vertical-align:middle; line-height:50px;}    
    26         #a1 div:hover{ background-color:#b3b6bb; border-top:1px solid #F39; cursor:pointer}
    27         #yanse{ background-color:#00C;
    28               }
    29         </style>
    30     </head>
    31     
    32     <body>
    33         <div id="e1"> 
    34             <div id="di"></div>
    35         </div>
    36     <!----------------------------------------------------->
    37         <div id="w1"></div>
    38   <br> <br> <br> <br> <br> <hr><br>  
    39   
    40   <!-------------------------------------------------------------->   
    41         <div id="a1">
    42             <div class="a2">春节</div>
    43             <div class="a2">元宵节</div>
    44             <div class="a2">端午节</div>
    45             <div class="a2">中秋节</div>
    46             <div class="a2">国庆节</div>
    47         </div>
    48         <!---</div>------------------------------------------------------------------------------>
    49         <br><br><br><br><br><br><br><br><br><br><br><br><br>
    50     <div id="yanse">
    51           <img src="aa.png" width="500px" height="60px"/>
    52         
    53     </div>  
    54 </body>
    55     </html>
  • 相关阅读:
    用css3弹性盒子模型实现九宫格布局
    css布局之左中右结构总结
    内联块inline-block的垂直间隙问题
    Jquery选择器 讲解
    U大师装系统
    陈伟:软件趋势——云物移大智
    asp网站发布步骤总结
    MYfirst
    ASP.net 利用From实现上传文件
    【ASP.NET Core CentOS 发布】(四)在CentOS上安装.NET Core运行时、部署到CentOS
  • 原文地址:https://www.cnblogs.com/aqxss/p/6181797.html
Copyright © 2020-2023  润新知