bottom to its default value

I'd like to be able to set the margin-bottom of an element to its default value.

Consider the following example in which there are h1 elements which have their respective margin-bottom style properties set to 0:

h1 {
  border: 1px solid red;
  margin-bottom: 0;
}

p {
  margin: 0;
}
<h1>First Heading</h1>
<p>Paragraph</p>

<h1 id="normal-margin">Second Heading</h1>
<p>Paragraph</p>

I think the property you're looking for is unset .

unset resets the property to its inherited value if it inherits from its parent or to its initial value if not. Via - https://developer.mozilla.org/en-US/docs/Web/CSS/unset

jsFiddle: http://jsfiddle.net/AndrewL32/65sf2f66/58/

div {
  border: medium solid green;
  margin: 10px 0px;
}
h2 {
  margin-bottom:10px;
}

/* but make those in the sidebar use the value of the 'color' property (initial value) */
h2.specialHeader {
  margin-bottom: unset;
}
<div><h2>Normal Header</h2></div>
<div><h2 class="specialHeader">Special Header</h2></div>

Currently it's not possible. In some future, use the revert keyword

As explained in 7.3. Explicit Defaulting, there are 4 diferent defaulting behaviors:

  • initial sets a property to its initial value.

    In the case of margin-* , that's 0 .

  • inherit sets a property to the value of the parent element (or to the initial value for the root element).

  • unset behaves as inherit for inherited properties, and as initial otherwise.

    margin-* are not inherited, so it would produce 0 .

  • The behavior of revert depends on the origin of the declaration

  • For user-agent origin, it behaves as unset
  • For user origin, it rolls back the cascade to the user-agent level, so that the specified value is calculated as if no author-level or user-level rules were specified for the property.
  • For author origin, it rolls back the cascade to the user level, so that the specified value is calculated as if no author-level rules were specified for the property.
  • So the behavior you want is revert 's one, ie

  • The user-agent adds some margin to h1 elements
  • One of your (author) declarations removes that margin
  • revert rolls back that to the margin defined by the user-agent
  • Note revert is a recent addition to the CSS Cascading and Inheritance Level 4 spec, which is still only a draft. Therefore, browsers don't support it yet.

    链接地址: http://www.djcxy.com/p/87994.html

    上一篇: 两个外键作为主键

    下一篇: 底部为其默认值