zoukankan      html  css  js  c++  java
  • CSS3之box-shadow

    1、属性简介

         box-shadow:颜色值|inset|none|!important

         

    2、浏览器兼容性

    (1)IE不兼容,IE9和IE10未知;

    (2)火狐3.5(包含3.5)以上兼容

    (3)Chrome 2.0.x 兼容

    (4)Opera不兼容


    3、属性实例

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>CSS3之box-shadow</title>
    <style type="text/css">
       body{
    	   animation-name:!important;
    	   animation-play-state:running;
    	   100%;
    	   height:100%;
    	   font-size:14px;
    	   font-variant:normal;
       }
       #divStyle{
    	   60%;
    	   height:200px;
    	   background-color:#CFC;
    	   font-size-adjust:inherit;
    	   box-shadow:inset;
    	   box-shadow:none;
    	   box-shadow:!important;
    	   
    	   -moz-box-shadow:#C00;
    	   -webkit-border-shadow:#306;
       }
       .tab{
    	   background-color:#FF9;
    	   text-align:center;
    	   100%;
    	   height:100%;
       }
    	   
    </style>
    </head>
    
    <body>
      <div id="divStyle">
         <table class="tab" cellpadding="1" cellspacing="1" border="1">
             <tr>
               <th rowspan="3"></th>
               <th colspan="3"></th>
               <th colspan="2" rowspan="2"></th>
               <th colspan="2" rowspan="2"></th>
             </tr>
             <tr>
               <th rowspan="2"></th>
               <th rowspan="2"></th>
               <th rowspan="2"></th>
             </tr>
             <tr>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
             </tr>
             <tr>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
             </tr>
             <tr>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
             </tr>
             <tr>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
             </tr>
             <tr>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
             </tr>
             <tr>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
             </tr>
             <tr>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
             </tr>
             <tr>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
               <th></th>
             </tr>
         </table>
      </div>
    </body>
    </html>
    

    4、运行结果


  • 相关阅读:
    Java学习62
    Java学习61
    Maven3种打包方式之一maven-assembly-plugin的使用
    sftp 上传下载 命令介绍
    JMock+Junit4结合完成TDD实例
    UML类图中类与类的四种关系图解
    接口之间的多继承
    Linux中在当前目录下查找某个文件
    .gitignore与exclude
    pro git
  • 原文地址:https://www.cnblogs.com/hzcya1995/p/13315373.html
Copyright © 2011-2022 走看看