關於placeholder的小tip

2021-07-10 18:35:03 字數 543 閱讀 5205

h5給我們提供了許多方便的屬性以及更加語義化的標籤,但是瀏覽器的相容性還是一大問題,首先想要使用placeholder屬性瀏覽器需要支援h5,而對於支援h5的瀏覽器來說顯示效果也是有一定區別,當我們僅僅想要改變input框內文字的顏色,使其能與placeholder的灰色區別開來,比如紅色(input)時,chorme和safari都完成了我們預期的目標,而ff與ie10卻連同placeholder的顏色一併修改了,這就違背了我們當初的目的,經過查閱度娘,得到了乙個親測可用的解決辦法,可以對placeholder的顏色進行有效的調整:

::-moz-placeholder  

//ff

::-webkit-input-placeholder  

//chrome,safari

:-ms-input-placeholder  

//ie10

雖然之前在自己部落格對於偽類偽元素進行了介紹以及使用,但是這種書寫方法還是第一次見,因為css3規範規定偽類使用單冒號,偽元素使用雙冒號,但同樣存在相容性的問題。查閱資料也沒能理解這種方式,希望有讀者能夠解答一下我的迷惑。

關於HTML5 Placeholder的一點總結

1.placeholder是什麼?placeholder 佔位符 是 html5 新增的乙個 html 屬性,用來對可輸入欄位的期望值提供提示資訊 2.placeholder怎麼用?input id username name username placeholder 請輸入使用者名稱 type t...

關於 設定 placeholder 無效解決辦法

一 設定placeholder的方法 placeholder屬性用來設定控制項內部的提示資訊 改變placeholder的樣式 input placeholder 二 各瀏覽器樣式相容設定 1 針對谷歌瀏覽器的設定方式 input webkit input placeholder 2 針對火狐瀏覽器...

關於IE支援placeholder屬性解決方案

在html5中,文字框,也就是input,type為text,或者password,新增了乙個屬性placeholder,也就是佔位符,當輸入的時候,佔位符就會消失。這個屬性非常好用,因為有這個必要html5才會有這個屬性,然而在ie下,就沒有這效果,那麼我們來實現ie9的相容效果 我寫了乙個jqu...