css實現禁止點選的方法：1、通過設定「disabled」為input框新增禁用狀態；2、通過設定「cursor:not-allowed」為禁用狀態新增狀態；3、設定「pointer-events:none」即可。

本文操作環境：Windows7系統、HTML5&&CSS3版，DELL G3電腦

CSS實現禁用狀態，樣式設定以及不可點選事件的行為

今天為大家分享一篇通過css禁用狀態，樣式設定以及不可點選樣式事件的範例講解，具有很好的參考價值，希望對大家有所幫助。一起跟隨慫慫過來看看吧

一：為input框新增禁用狀態

1、readonly表示此域的值不可修改，僅可與 type="text" 配合使用，可複製，可選擇,可以接收焦點，後臺能接收到傳值.
程式碼演示：

<input type="text" name="firstname" value=""  readonly="readonly" />

2、disabled表示禁用input元素，不可編輯，不可複製，不可選擇，不能接收焦點,，後臺不能接收到傳值.
程式碼演示：

　<input type="text" name="firstname" value="" disabled="disabled" />

二：為禁用狀態新增狀態

滑鼠不可點選主要是兩種表現：

1.滑鼠不可點選時的顯示狀態：cursor: not-allowed

樣式演示：

<style> 
    input[readonly]   //readonly:後臺能接收此input框傳值
    {
         background:#dddddd; //為帶有readonly的input框新增背景顏色
         cursor: not-allowed  // 表示一個紅色的圈加一個斜槓
    }
</style>

2.滑鼠原有的事件不能實現:pointer-events:none

樣式演示：

<style> 
    input[disabled] //disadled:後臺不可接收此input傳值
    {
         background:#dddddd; //為帶有disabled的input框新增背景顏色
         pointer-events:none;//滑鼠點選不可修改
    }
</style>

--------------------------------拓展---------------------------------

cursor 定義和用法

cursor 屬性規定要顯示的遊標的型別（形狀）。【推薦學習：《》】

該屬性定義了滑鼠指標放在一個元素邊界範圍內時所用的遊標形狀（不過 CSS2.1 沒有定義由哪個邊界確定這個範圍）。

可能的值

以上就是css怎麼實現禁止點選的詳細內容，更多請關注TW511.COM其它相關文章！