CSS中有時候需要控制圖片是否可以被拖拽。在某些情況下,我們不需要用戶拖拽圖片,這時候可以使用CSS樣式禁止圖片拖拽。
img{ user-drag: none; user-select: none; -moz-user-select: none; -webkit-user-drag: none; -webkit-user-select: none; -ms-user-select: none; }
以上CSS代碼可以禁止用戶通過鼠標(biāo)拖拽圖片。其中各個屬性的含義如下:
- user-drag:指示元素是否可以通過拖拽進行移動。none表示該元素不能被拖拽。
- user-select:指示元素是否可以被用戶選中。none表示該元素不能被選中。
- -moz-user-select、-webkit-user-drag、-webkit-user-select、-ms-user-select:瀏覽器廠商私有的CSS屬性,用于跨瀏覽器控制圖片是否可以被拖拽和選中。
需要注意的是,以上屬性在不同的瀏覽器中的支持情況可能不同。在某些瀏覽器中,以上屬性可能不起作用,這時候可以使用JavaScript來實現(xiàn)。
總的來說,CSS樣式可以很方便地控制圖片是否可以被拖拽和選中,使得網(wǎng)頁的交互性更好。
上一篇css img等比例縮放
下一篇css3字體投影和漸變