CSS 中的笑脸“:)”是什么意思?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/25444328/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-30 02:31:37  来源:igfitidea点击:

What does the smiley face ":)" mean in CSS?

csscss-hack

提问by Mark

I spotted this CSS code in a project:

我在一个项目中发现了这个 CSS 代码:

html, body { :)width: 640px;}

I have been around with CSS for a long time now but I never saw this ":)" code before. Does it mean anything or is it just a typo?

我已经接触 CSS 很长时间了,但我以前从未见过这个“:)”代码。它有什么意义还是只是一个错字?

采纳答案by revo

From an article at javascriptkit.com, that's applied for IE 7and earlier versions:

来自javascriptkit.com 上一篇文章,它适用于IE 7及更早版本:

if you add a non-alphanumeric character such as an asterisk (*) immediately before a property name, the property will be applied in IE and not in other browsers.

如果您*在属性名称前添加一个非字母数字字符,例如星号 ( ),则该属性将应用于 IE 而不是其他浏览器。

Also there's a hack for <= IE 8:

<= IE 8还有一个 hack :

div {
  color: blue;      /* All browsers */
  color: purple;  /* IE8 and earlier */
 *color: pink;      /* IE7 and earlier */
}

However that's not a good idea, they don't validate. You always feel free to work with Conditional commentsfor targeting specific versions of IE:

但是,这不是一个好主意,它们无法验证。你总是可以随意使用条件注释来针对特定版本的IE

<!--[if lte IE 8]><link rel="stylesheet" href="ie-8.css"><![endif]-->
<!--[if lte IE 7]><link rel="stylesheet" href="ie-7.css"><![endif]-->
<!--[if lte IE 6]><link rel="stylesheet" href="ie-6.css"><![endif]-->

But for those wanna see the hack in real, please open up this pagein the latest version of IE you have. Then go to developer mode by doing a F12. In Emulation section (ctrl+8) change document mode to 7and see what happens.

但是对于那些想要真正看到黑客攻击的人,请在您拥有的最新版本的 IE 中打开此页面。然后通过执行F12. 在仿真部分 ( ctrl+ 8) 将文档模式更改为7并查看会发生什么。

enter image description here

在此处输入图片说明

The property used in the page is :)font-size: 50px;.

页面中使用的属性是:)font-size: 50px;

回答by Salman A

It looks like a CSS hack to target IE7 and earlier browsers. While this isinvalid CSS and browsers should ignore it, IE7 and earlier will parse and honor this rule. Here is an example of this hack in action:

它看起来像是针对 IE7 和更早版本浏览器的 CSS hack。虽然这无效的 CSS 并且浏览器应该忽略它,但 IE7 及更早版本将解析并遵守此规则。以下是此 hack 的示例:

CSS

CSS

body {
    background: url(background.png);
    :)background: url(why-you-little.png);
}

IE8 (ignores the rule)

IE8(忽略规则)

Example 1 - IE8

示例 1 - IE8

IE7 (applies the rule)

IE7(应用规则)

Example 1 - IE7

示例 1 - IE7

Note that it does not have to be a smiley face; BrowserHacksmentions:

请注意,它不必是笑脸;BrowserHacks提到:

Any combination of these characters:
! $ & * ( ) = % + @ , . / ` [ ] # ~ ? : < > |
[before the property name will work on] Internet Explorer ≤ 7

这些字符的任意组合: [在属性名称适用之前] Internet Explorer ≤ 7
! $ & * ( ) = % + @ , . / ` [ ] # ~ ? : < > |



The GAH hot dog stand example is here.

GAH 热狗摊的例子在这里