在html中,可以利用touch-callout和user-select屬性來屬性禁止複製貼上功能,只需要設定「user-select:none;-webkit-touch-callout:none;」樣式即可。
本教學操作環境:windows7系統、CSS3&&HTML5版、Dell G3電腦。
小夥伴們在開發的時候偶爾會遇到這樣的需求,客戶要求文章頁禁止複製和貼上,實現這個功能代碼如下(可同時實現PC端和手機端):
*{ -webkit-touch-callout:none; /*系统默认菜单被禁用*/ -webkit-user-select:none; /*webkit浏览器*/ -khtml-user-select:none; /*早期浏览器*/ -moz-user-select:none;/*火狐*/ -ms-user-select:none; /*IE10*/ user-select:none; }
在加入這段程式碼後,在IOS 上會有問題的,這時候你會發現input 框無法正在輸入了內容了;造成這個原因就是-webkit-user-select:none; 這個屬性造成的。
解決這個方法 就是 在css 檔案中同時設定input 的屬性,如下所示:
input { -webkit-user-select:auto; /*webkit浏览器*/ }
推薦教學:《html影片教學》
以上是html怎麼禁止複製貼上的詳細內容。更多資訊請關注PHP中文網其他相關文章!