无法拖动未设置 css 属性的元素:全部

Posted

技术标签:

【中文标题】无法拖动未设置 css 属性的元素:全部【英文标题】:can't drag element that has css property unset: all 【发布时间】:2017-12-03 10:16:49 【问题描述】:

似乎我无法拖动具有unset: all css 属性的元素。

.my-component 
  all: initial;
  * 
    all: unset;
  

我在 chrome 扩展中使用这些规则,在用户浏览器页面中注入的元素上(以防止本地样式影响我的组件)。不幸的是,元素不再是可拖动的。

这些元素在 html 中具有 draggable 属性。

我尝试了pointer-events: auto;-webkit-user-drag: auto;user-select: all;,但仍然无法使元素可拖动。

我必须将某些属性设置为正常。

如果有人有想法,我将非常感谢有关此主题的任何帮助。

编辑:查看此代码笔 - https://codepen.io/thomaslh/pen/OgQNMz

【问题讨论】:

【参考方案1】:

看起来您需要添加 2 个 CSS 属性。 user-select-webkit-user-drag

.el 
  all: unset;
  -webkit-user-drag: element;
  user-select: none;
<div class="el" draggable="true">
  drag
</div>

【讨论】:

谢谢迈克尔,这正在做这项工作 ;) 非常快速的答案。 @ThomasL'huillier 亲爱的,不客气!好问题,我认为随着人们使用可拖动/更多,这可能会出现更多。

以上是关于无法拖动未设置 css 属性的元素:全部的主要内容,如果未能解决你的问题,请参考以下文章

拖动文件时更改元素的 CSS 属性

无法设置未定义的属性“全部”

解决el-table设置了固定列导致的滚动条无法拖动问题

解决el-table设置了固定列导致的滚动条无法拖动问题

web自动化中页面多个滚动条时的拖动操作?

CSS - 高度坍塌和外边距溢出问题及解决方法