這種型別的搜尋框應該較為常見，設計元素有圓角和內陰影，在css2時期通常都是用實現的，來看下css3的效果，而對於ie6,7這樣的悲劇瀏覽器，也不至於太難看:
畫圓
通過設定乙個較大的圓角值就能實現圓形，下面畫了乙個直徑為100的圓。
內陰影效果
box-shadow的第乙個值是陰影型別，預設是外陰影，平常我們使用它都不會設定這個值，所以就是外陰影的效果。如果要實現內陰影效果，需要手動設值：inner 。
搜尋框
回到開始的例子，本例使用了css gradient, border-radius, 內陰影效果的box-shadow
設定css陰影和取消css陰影
之前用mui布局樣式，但是一直都會有這個陰影，在瀏覽器除錯也除錯沒用 這是設定陰影 長 寬 模糊度 顏色 box shadow 0 1px 6px ccc 取消的話直接設定為0就行了，不建議直接去mui.css裡面刪掉，如果改掉mui裡面的樣式全部的樣式都會變 這是取消陰影 長 寬 模糊度 顏色 b...
box shadow 陰影 CSS內陰影
注意 ie6 ie8都不支援邊框陰影 box shadow ie9 firefox，chrome，opera支援邊框陰影屬性 box shadow 內陰影 inset 影 預設為 影 在邊框陰影 box shadow 的基本語法中，引數inset是可選可不選的，選引數inset，將外部陰影改為內部陰...
CSS 陰影動畫優化技巧一則
本技巧來自這篇文章 how to animate box shadow with silky smooth performance 本文不是直譯，因為覺得這個技巧很有意思很有用，遂起一文。box shaodw在我們的工作中使用以及越來越多，伴隨陰影的動畫或多或少都有一點。假設，我們有下面這樣乙個盒子...