1. 程式人生 > >解決設定相同高度情況下和不同高

解決設定相同高度情況下和不同高

今天在做一個檢索的功能時,做一個搜尋框
都知道這個功能一個input一個button搞定
但是在設定樣式的時候發現
這裡寫圖片描述
哎,我明明設定了同樣的高啊,為什麼會不同高呢?
於是開始懷疑人生
陷入了漫長的回憶……..
然後在記憶中,彷彿記得我在初學HTML和CSS的時候寫淘寶靜態頁也遇到這個問題
居然這麼久過去了,還是不會解決
發現這個還是一個比較重要的知識點,有必要給大家普及一下

所以,為什麼呢?

原來,我們在使用這兩個標籤的時候,這兩個標籤有許多預設的屬性
其中border都是他們預設設定了的屬性
而且他們的border值還不一樣,所以才導致它們的高度不一樣
將border值都設定0後你就會看見奇蹟
這裡寫圖片描述


可把它厲害壞了

順便再說點別的,這兩個標籤在觸發的時候都會有藍色焦點框,如果大家不需要
設定outline:none即可