教你如何使用css隱藏input的游標

2021-09-10 08:35:52 字數 478 閱讀 8913

今天公司的ui突然跑過來問我乙個問題:「如何在不影響操作的情況下,把input的游標隱藏了?」。

我相信很多人會跟我一樣,覺得這是個什麼狗屁需求,輸入框不要游標這不是***嗎?可惜我們只是個小小的擼碼仔,沒有反駁的權利只能默默接受…

在網上搜尋了很多方式:用div模擬,設定readonly,設定disabled,設定自動blur等等方式,發現都不能滿足需求,最後還是找到一位大神提供的方法完美解決。

###首先隱藏游標

因為游標是跟隨文字的,所以我們把文字的color設定為透明,游標就不見了耶~

但是問題來了,文字都透明了要輸入框有啥用?別著急,請往下看~

###把文字給顯示出來

在input上設定text-shadow,文字是透明的但是我們可以用文字陰影來代替文字的顏色,這樣就完美解決啦。

教你如何使用cdn加速wordpress?

本文連線 一。概述 很多朋友可能像我一樣將blog放在國外的主機上,雖然享受了實惠的 可在訪問速度上肯定要比國內略遜一籌。顯然這個時候的瓶頸在網路層和傳輸層上,緩 存類的外掛程式效果非常有限。形象點說這個就像卡車拉了一車貨,有大有小,網路環境就像公路。遠在海外的伺服器要拉貨回國自然要走相當長的一段路...

使用CSS隱藏元素滾動條

如何隱藏滾動條,同時仍然可以在任何元素上滾動?首先,如果需要隱藏滾動條並在內容溢位時顯示滾動條,只需要設定overflow auto樣式即可。想要完全隱藏滾動條只需設定overflow hidden即可,但是這樣一來將導致元素內容不可滾動。時至今日,還沒有任何一條css規則可以使元素可以隱藏滾動條的...

不同場景下使用CSS隱藏元素

使用 css 讓元素不可見的方法很多,剪裁 定位到螢幕外 明度變化等都是可以的。雖然它們都是肉眼不可見,但背後卻在多個維度上都有差別。元素不可見,同時不佔據空間 輔助裝置無法訪問 不渲染 使用 script 標籤隱。例如 此時,1.jpg 是不會有請求的。同樣 2.jpg 也是不會有請求的。另外,標...