重写CSS属性没有默认值(Overriding CSS properties that don

2019-07-29 01:32发布

是否有可能在CSS覆盖的属性,如果该属性没有默认值?

例如,假设您的主要样式定义了边界特定要素:

#element {
  border: 1px solid #000;
}

如果你想从辅助样式表禁用边框,你可以这样做:

#element {
  border: none;
}

假设二次样式表被主之一后加载, border: none规则将优先考虑和删除边框。

但是,如果你试图什么来覆盖不具备默认或空值的属性?

#element {
  position: absolute;
  left: 0;
}

现在说,在您的辅助样式表,你想这样做:

#element {
  right: 0;
  top: 0;
}

而你不想为任何值left 。 还有,因为没有这样的东西left: none; ,所以......你怎么“undeclare”在left财产分配的主要样式表?

Answer 1:

如果我正确地读你的问题,你想,在一个样式表中,“擦除”你是在另一个样式表有一个声明,使得属性将计算为默认值?

目前还没有任何办法将其重置为在任何一个值使用浏览器作为默认给定元素。 你可以得到最接近的是用CSS3 initial关键字 ,它根据该规范,而不是根据浏览器如何定义它的属性重置为初始/默认值:

#element {
  left: initial;
  right: 0;
  top: 0;
}

有没有为它多浏览器的支持,除了在Safari / Chrome和Firefox(如-moz-initial ),所以你的下一个最佳选择是查找初始值和硬编码。 对于left属性,它的auto (我相信它是在所有浏览器的任何元素此值无论如何),所以:

#element {
  left: auto;
  right: 0;
  top: 0;
}


Answer 2:

每个CSS属性都有依赖于浏览器的默认值,所以没有这样的东西作为CSS属性没有默认值。

作为BoltClock说, initial是最好的选择。

下面是一些关于它的规格:

http://www.w3.org/TR/css3-cascade/

编辑:

jmbertucci的评论之前,我没想到我怎么一直这样做,

通过使用CSS重置您可以定义不依赖于浏览器中使用自己的默认值。 如果定义left: 10px; 在自己的reset.css那么当你需要它回落到默认,你可以使用相同的值。

例如,我经常找字体大小从我reset.css并用它们做高的计算依赖于文字高度。

如果使用PHP或其他一些预处理你可以随时使用的CSS文件太:

<?php
define('DEFAULT_WIDTH', 'width: 100px;');
?>

div {
    top: 100px;
    <?php print DEFAULT_WIDTH; ?>
}


文章来源: Overriding CSS properties that don't have default values