box-shadow:none;
box-shadow: h-shadow v-shadow blur spread color inset;box-shadow引數解析 值
描述none
預設值，元素沒有任何陰影效果。
h-shadow
陰影水平偏移量，其值可以是正負值。如果取正值，則陰影在元素的右邊，反之取負值，陰影在元素的左邊。
v-shadow
陰影垂直偏移量，其值可以是正負值。如果取正值，則陰影在元素的底部，反之取負值，陰影在元素的頂部。
blur
陰影模糊半徑，可選引數。其值只能是正值，如果取值為「0」時，表示陰影不具有模糊效果，如果取值越大，陰影的邊緣就越模糊。
spread
陰影擴充套件半徑，可選引數。其值可以是正負值，如果取值為正值，則整個陰影都延展擴大，反之取值為負值，則整個陰影都縮小。
color
陰影顏色，可選引數，如果不設定任何顏色時，瀏覽器會取預設色，但各瀏覽器預設色不一樣，特別是在webkit核心下的瀏覽器將無色，也就是透明，建議不要省略這個引數。
inset
陰影型別，可選值。如果不設定，其預設的投影方式是外陰影；如果取其唯一值「inset」，就是給元素設定內陰影。
此處參考
在說明我們這個應用之前，先給大家推薦乙個**這個**裡面可以除錯盒子模型陰影，文字陰影，圓角等，功能挺多的，除錯完之後可以直接複製**
我們接下來要做的效果，是這樣的
注意這個區域，白色的盒子模型上面遺留著上面橙色盒子的邊框陰影，這個效果怎麼做呢？
我們來寫他們的css**
*
.contain
margin: 0 auto;
margin-top: 10px;
width: 200px;
height: 100px;
background: #ff7e00;
border-radius: 10px;
box-shadow: 0px 9px 15px -1px rgba(0,0,0,0.3);
} margin: 0 auto;
width: 180px;
height: 100px;
background: white;
}
我們發現橙色盒子的下邊框的陰影被白色盒子給遮住了，這可如何是好？我是用乙個特別猥瑣的方法解決的。
既然陰影被遮住了，那麼我們就讓白色盒子補償給橙色盒子一條陰影，不是有乙個引數叫做inset嗎？我們把白色盒子的上邊框的陰影往裡面投影，補上這個空缺不就好了嗎？
*
.contain
margin: 0 auto;
margin-top: 10px;
width: 200px;
height: 100px;
background: #ff7e00;
border-radius: 10px;
box-shadow: 0px 9px 15px -1px rgba(0,0,0,0.3);
} margin: 0 auto;
width: 180px;
height: 100px;
background: white;
box-shadow: inset 0 9px 5px -1px rgba(0,0,0,0.1);//新增，其他所有的引數要跟橙色盒子的陰影一樣，只是方向改變，這樣才不會影響結合起來的效果。
}
box shadow的應用技巧
box shadow none box shadow h shadow v shadow blur spread color inset box shadow引數解析 值 描述none 預設值，元素沒有任何陰影效果。h shadow 陰影水平偏移量，其值可以是正負值。如果取正值，則陰影在元素的右邊，...
Two pointers技巧的應用
查詢陣列中兩個位置不同的數字之和為sum的個數。先來看看暴力法，粗略估計，時間複雜度為0 n 2 void violence int a,int totalnumber,int sum int count 0 計算不匹配的結果次數 不匹配次數是41次，嗯，看起來結果還不錯的樣子。來看看two poi...
譯 高效的 「box shadow」 動畫
如何才能防止在給box shadow製作動畫過渡時導致的每一幀都要進行的重繪 re paint 從而提高頁面的效能？答案就是 不可能。給變化的box shadow製作動畫會大大縮減頁面渲染的效能。但是，這裡依然有類似的方法實現相同的效果。盡量的減少重繪的次數，可以保證你的動畫能夠保證在60 fps左...