最近在設計班級**的首頁，模仿別人部落格裡使用到的可伸縮的搜尋框，剛開始想想覺得挺奇妙的，後來發現這其實不難，利用之前 css 學過的 duration 就可以實現了。下面是我從班級首頁中抽出來的搜尋框製作成的 demo，跟大家分享下。
我們先看看 css **：
.box
.assistive
#searcharea
#searcharea:focus
#searchsubmit
下面是相應的 html **：
ok! 這裡有必要解釋下，我在編寫這個搜尋框中遇到的問題，乙個是隱藏不見的搜尋按鈕，利用 display:none; 來隱藏按鈕，頁面 html 實際**仍需要編寫，而且type="submit" 這個很重要，它關係到乙個可傳遞表單的完整性，剛開始我沒有注意到新增這個，導致 enter 提交後位址列沒有變化。這裡的表單使用 get 方式傳遞引數內容，我們發現搜尋內容可以在位址後面顯示。這個對於搜尋來說沒什麼問題，因為它不涉及到什麼安全問題，但對於有密碼的表單，比如說登入框，我們就不能選擇 get 來傳遞了，只能使用保密性好的 post 來傳遞。
另外乙個問題是，duration 的使用。確切的說不是 duration 的使用本身，而是 id 的使用。剛開始，我沒有在 html 中使用乙個 id，全部是 class，這時候問題來了，class 下的樣式不能完全的在頁面中顯示，比如說這裡的 duration ease 滑動效果。為什麼會這樣？仔細思考下，原來是 display:none; 在作怪，它會隔斷一些類的作用，而 id 的作用許可權高於 class，這裡我們需要通過 id 來更有效的定義樣式。
ok! so much! 我們去看看
效果 demo哈！
什麼是可伸縮性測試
提到效能測試，大家馬上腦海裡馬上會出現負載測試 壓力測試 容量測試等概念，那麼大家知不知道還有可伸縮性測試。可伸縮性測試可以看成效能測試的乙個擴充套件，關注系統本身的可伸縮性，下面給大家具體介紹。系統的可伸縮性可以從硬體和軟體兩個方面來理解 1 硬體的可伸縮性 是不是可以通過硬體裝置的增加來支援更多...
什麼是可伸縮性測試
提到效能測試，大家馬上腦海裡馬上會出現負載測試 壓力測試 容量測試等概念，那麼大家知不知道還有可伸縮性測試。可伸縮性測試可以看成效能測試的乙個擴充套件，關注系統本身的可伸縮性，下面給大家具體介紹。系統的可伸縮性可以從硬體和軟體 兩個方面來理解 1 硬體的可伸縮性 是不是可以通過硬體裝置的增加來支援更...
Amdahl定律和可伸縮性
效能的思考 提公升效能意味著可以用更少的資源做更多的事情。但是提公升效能會帶來額外的複雜度，這會增加執行緒的安全性和活躍性上的風險。我們渴望提公升效能，但是還是要以安全為首要的。首先要保證程式能夠安全正常的執行，然後在需要的時候進行效能優化，並且優化後的程式要盡可能保持併發性，讓多處理中每個cpu盡...