* HTML Body在css样式表中的含义是什么?

时间:2022-11-12 12:42:59

In a stylesheet i have:

在样式表中,我有:

    * HTML BODY
    {
        padding-right: 0px;
        padding-left: 0px;
        padding-bottom: 25px;
        padding-top: 190px;
    }
    * HTML #maincontent
    {
        width: 100%;
        height: 100%;
    }

i know that a . means class and a # means applied to the id, but what does * HTML mean?

我知道了。表示类和#表示应用于id,但* HTML是什么意思?

5 个解决方案

#1


The * is the universal selector, and thus matches any element. e.g.

*是通用选择器,因此匹配任何元素。例如

P * { }

Matches any element which is the child of a P tag

匹配任何P标签的子元素

* HTML

should mean nothing because HTML cannot be the child of anything (by definition). It's used because IE (edit, at least IE 5 - 6 - thanks RoBorg!) ignores * and so it can be used to define IE specific styles:

应该没有任何意义,因为HTML不能成为任何东西的孩子(根据定义)。它的使用是因为IE(编辑,至少IE 5 - 6 - 感谢RoBorg!)忽略*,因此它可以用来定义IE特定的样式:

HTML {
 // Normal styles
}

* HTML {
 // IE Specific styles
 }

See http://www.peachpit.com/articles/article.aspx?p=358552

#2


* means any element
HTML and BODY mean the <html> and <body> elements.

*表示任何元素HTML和BODY表示和元素。

Therefore * HTML BODY means a body element inside an HTML element, inside any element.

因此,* HTML BODY表示HTML元素内的任何元素内的body元素。

This is actually a browser hack: some browsers will match it and some won't (Internet Explorer matches, Firefox doesn't, not sure about others).

这实际上是一个浏览器黑客攻击:有些浏览器会匹配它,有些浏览器不匹配(Internet Explorer匹配,Firefox不匹配,不确定其他浏览器)。

#3


One reason people add selectors like *, html, or body (or in this case, all 3) to a stylesheet rule is to increase the selector specificity calculation. Of course, html will never be a child of anything else, so * html is a specific IE hack, but there is a reason why people would add html or body to a declaration:

人们在样式表规则中添加*,html或body(或者在这种情况下,全部3)等选择器的一个原因是增加选择器特异性计算。当然,html永远不会是其他任何东西的孩子,所以* html是一个特定的IE黑客,但是有一个原因,人们会在声明中添加html或body:

For example:

html p { font-color: red }
p { font-color: blue }  

Paragraphs within html tags (as in, all of them) is more specific than just paragraphs, so the font-color will be red, regardless of the ordering of these declarations in stylesheets. If there were a third rule with html body p it would take precedence.

html标记中的段落(如,所有这些段落)更具体而不仅仅是段落,因此无论样式表中这些声明的顺序如何,字体颜色都将为红色。如果有第三个规则与html body p,它将优先。

It's slightly less of a hack than using !important but it's better to key off of more semantic tags, if possible.

它比使用!更重要,但是如果可能的话,最好关掉更多的语义标签。

#4


Well, this is a really bad CSS selector statement, that's what. Let me break it down for you:

好吧,这是一个非常糟糕的CSS选择器语句,就是这样。让我为你分解一下:

[all elements] (sub-selection) [HTML] [BODY]

That is, it goes through all elements to find the HTML element, then the BODY inside. It's problem is that there will only be 1 body element at all times, and #maincontent either should be the BODY or be within it. Period.

也就是说,它遍历所有元素以找到HTML元素,然后是BODY。问题在于,任何时候都只有1个body元素,而#maincontent应该是BODY或者在其中。期。

As Joel said it might be to remind the designer, but I am not so sure of that. To me, that code is a definite "code smell"!

正如乔尔所说,这可能是为了提醒设计师,但我并不那么确定。对我来说,那段代码是一个明确的“代码味道”!

You should rewrite your CSS selectors to:

您应该将CSS选择器重写为:

body {

And:

#maincontent {

respectively.

#5


For the 2nd snippet, since * matches anything the element item is redundant. It looks like it's there to remind the author of the intent of the styles- that if he changes something in the 2nd snippet make sure he checks the the #maincontent element to make sure it looks right.

对于第二个片段,因为*匹配任何元素项是多余的。它看起来像是在那里提醒作者风格的意图 - 如果他改变第二个片段中的内容,请确保他检查#maincontent元素以确保它看起来正确。

#1


The * is the universal selector, and thus matches any element. e.g.

*是通用选择器,因此匹配任何元素。例如

P * { }

Matches any element which is the child of a P tag

匹配任何P标签的子元素

* HTML

should mean nothing because HTML cannot be the child of anything (by definition). It's used because IE (edit, at least IE 5 - 6 - thanks RoBorg!) ignores * and so it can be used to define IE specific styles:

应该没有任何意义,因为HTML不能成为任何东西的孩子(根据定义)。它的使用是因为IE(编辑,至少IE 5 - 6 - 感谢RoBorg!)忽略*,因此它可以用来定义IE特定的样式:

HTML {
 // Normal styles
}

* HTML {
 // IE Specific styles
 }

See http://www.peachpit.com/articles/article.aspx?p=358552

#2


* means any element
HTML and BODY mean the <html> and <body> elements.

*表示任何元素HTML和BODY表示和元素。

Therefore * HTML BODY means a body element inside an HTML element, inside any element.

因此,* HTML BODY表示HTML元素内的任何元素内的body元素。

This is actually a browser hack: some browsers will match it and some won't (Internet Explorer matches, Firefox doesn't, not sure about others).

这实际上是一个浏览器黑客攻击:有些浏览器会匹配它,有些浏览器不匹配(Internet Explorer匹配,Firefox不匹配,不确定其他浏览器)。

#3


One reason people add selectors like *, html, or body (or in this case, all 3) to a stylesheet rule is to increase the selector specificity calculation. Of course, html will never be a child of anything else, so * html is a specific IE hack, but there is a reason why people would add html or body to a declaration:

人们在样式表规则中添加*,html或body(或者在这种情况下,全部3)等选择器的一个原因是增加选择器特异性计算。当然,html永远不会是其他任何东西的孩子,所以* html是一个特定的IE黑客,但是有一个原因,人们会在声明中添加html或body:

For example:

html p { font-color: red }
p { font-color: blue }  

Paragraphs within html tags (as in, all of them) is more specific than just paragraphs, so the font-color will be red, regardless of the ordering of these declarations in stylesheets. If there were a third rule with html body p it would take precedence.

html标记中的段落(如,所有这些段落)更具体而不仅仅是段落,因此无论样式表中这些声明的顺序如何,字体颜色都将为红色。如果有第三个规则与html body p,它将优先。

It's slightly less of a hack than using !important but it's better to key off of more semantic tags, if possible.

它比使用!更重要,但是如果可能的话,最好关掉更多的语义标签。

#4


Well, this is a really bad CSS selector statement, that's what. Let me break it down for you:

好吧,这是一个非常糟糕的CSS选择器语句,就是这样。让我为你分解一下:

[all elements] (sub-selection) [HTML] [BODY]

That is, it goes through all elements to find the HTML element, then the BODY inside. It's problem is that there will only be 1 body element at all times, and #maincontent either should be the BODY or be within it. Period.

也就是说,它遍历所有元素以找到HTML元素,然后是BODY。问题在于,任何时候都只有1个body元素,而#maincontent应该是BODY或者在其中。期。

As Joel said it might be to remind the designer, but I am not so sure of that. To me, that code is a definite "code smell"!

正如乔尔所说,这可能是为了提醒设计师,但我并不那么确定。对我来说,那段代码是一个明确的“代码味道”!

You should rewrite your CSS selectors to:

您应该将CSS选择器重写为:

body {

And:

#maincontent {

respectively.

#5


For the 2nd snippet, since * matches anything the element item is redundant. It looks like it's there to remind the author of the intent of the styles- that if he changes something in the 2nd snippet make sure he checks the the #maincontent element to make sure it looks right.

对于第二个片段,因为*匹配任何元素项是多余的。它看起来像是在那里提醒作者风格的意图 - 如果他改变第二个片段中的内容,请确保他检查#maincontent元素以确保它看起来正确。