旁路CSS“通用选择器*复位” [英] Bypass CSS "Universal Selector * Reset"

问题描述

我已经调查过为网站编写目标网页。

这里有问题：原始开发者在通用选择器*重置主要css文件：

  * {//通用选择器'*'重置
 margin：0; 
 padding：0; 
} 
  

然后在它周围构建网站样式。

不幸的是，这需要大量代码来处理表，列表，标题等。

：有任何方法绕过单个对象（表，列表等）的选择器，甚至一般的页面（除了不包括css文件）？

修改：有些人对我的问题感到困惑。旁路我的意思是忽略星号选择器而不是覆盖它...还要注意，我试图最小化额外的代码。

编辑2： / strong>这里是一个（在CSS规范中定义）可能与浏览器的元素默认值不同。

I've been comisioned to write landing pages for a website.

Here's the problem: the original developer(s) added a "Universal Selector * Reset" in the main css file:

* { //Universal Selector '*' Reset
    margin: 0;
    padding: 0;
}

and then built the site styles around it.

Unfortunately, this is requiring alot of code to work around on Tables, Lists, Headings, Etc..

The Question is: Is there any way to bypass the selector for an individual object(table, list, etc) or even for the page in general(aside from not including the css file)?

Edit: Some people were confused by my question. By bypass I mean to ignore the asterisk selector rather than override it... Also note that I am trying to minimize on extra code.

Edit 2: here is a jsFiddle that illustrates my problem.
Note: "padding: initial;" dosen't seem to be working.

解决方案

Any other selector is more specific than the * selector and will thus override it's effects.
See the following sample Jsfiddle.

So therefore if you, for example, want to restore the paddings on a <table> you can simply do

table {
    padding: initial;
}

If this doesn't quite tickle your fancy you can instead fine-tune your asterisk selector to ignore elements of your choosing:

*:not(table) {
    [...]
}

Appendix:
As may come unexpected for many, setting a property and then using initial on it with a more specific selector doesn't necessarily reverse the setting.
Compare a reset to initial value (second image below) to an unstyled example (first image below) (depending on your browser the result may differ):

Unstyled:

Reset:

This is because the initial value (defined in the CSS spec) of the property may differ from your browser's default value for the element.

这篇关于旁路CSS“通用选择器*复位”的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！