从元素中删除特定的样式属性答案

【问题标题】：Removing a specific style property from element从元素中删除特定的样式属性
【发布时间】：2015-03-03 13:28:33
【问题描述】：

我的页面中有一个 div，它从我公司的自定义 CSS 文件中获取样式。其中一些样式会弄乱我的 div 的显示/定位方式。我追踪到它是display: inline-block;。

使用 Chrome 开发人员工具的元素选项卡，当我取消选择此特定行时，我的元素会正确显示：

所以我想我会覆盖该属性以显示默认值display: inline !important; 以模拟“删除”该属性。该属性已被覆盖，但我的元素仍然未对齐。

我还尝试在加载元素后使用 jQuery：$('#myelement').css('display', 'X'); 其中 X 是显示属性的任何可接受值。我也尝试了一个空的空间。没有提供在 Chrome 开发人员工具中取消选中（删除？）该属性的结果。

那么我还有哪些选项可以模拟取消选中 Chrome 开发工具的元素选项卡中的样式属性？我认为最接近的方法是以某种方式从我的元素中删除该属性，但我不确定如何执行此操作，因为该属性是在我不允许修改的外部 CSS 文件中定义的。

【问题讨论】：

你可以发布一些代码或重新创建小提琴吗？
您是否尝试仅编辑 CSS 文件 `
div 的默认显示模式是block。所以也许display:block !important;？
这应该有助于:) => stackoverflow.com/questions/5951365/…
@GaryStorey Holy... 这行得通。这是我信任 w3schools 列为默认值的结果：w3schools.com/cssref/pr_class_display.asp -- meta: 如何将其标记为已解决？

标签： jquery html css properties styles

【解决方案1】：

“div 的默认显示模式是block。所以可能是display:block !important;？” - 加里·斯托里

（作为实际答案给出的答案，因此可以将帖子标记为已回答。）

【讨论】：

后续：“初始值”与“默认值”有区别吗？ W3schools 和 Mozzila 都将初始/默认值显示为“内联”，这是我的假设来源。
w3schools.com/cssref/css_initial.asp 看看那个。
或标记的默认值实际上是 inline，所以它不是完全错误，对于 div 但默认或初始值是 block

【解决方案2】：

div 的默认 display 值为 block。所以你应该将值设置为：

div { display:block; }

如果由于某种原因不起作用，您可以尝试通过添加额外元素来覆盖以增加特异性。例如：

/*specificity value of 2 */
body div { display: block; }

/* or specificity value of 11 */
.content div {display: block; }

 /* or specificity value of 101 */
 #content div

这增加了选择器的特殊性，允许您覆盖当前值，而不会在以后无法覆盖。更多信息可以在in this article和this site找到。

如果以上都不起作用，请仅使用!important。 !important 应该永远是最后的选择！只有另一个!important 可以用导致非常糟糕的代码覆盖自己。

要了解有关元素初始/默认值的更多信息，您可以参考this article。

【讨论】：